Click to See Complete Forum and Search --> : Resizing table cell dynamically


green888
08-11-2004, 02:28 PM
I am trying to resize the table cell dynamically, why is this code not working?


------------------------------------------------------------------
<html>
<head>
<title></title>
<meta name="GENERATOR" content="Microsoft Visual Studio .NET 7.1">
<meta name="vs_targetSchema" content="http://schemas.microsoft.com/intellisense/ie5">
</head>
<body onmousemove="mmove();">
<script language="javascript">

function toggler(obj)
{
db=document.getElementById(obj);
if(db.style.display=="none")
db.style.display="";
else
db.style.display="none";
}

var moveflag = 0;
function mmove()
{
if (moveflag == 1)
{
var one=document.getElementById('one');
var two=document.getElementById('two');
var moveby = oldpos - window.event.y;
var firstLength = parseInt(one.height) - parseInt(moveby);
var secondLength = parseInt(two.height) + parseInt(moveby);
self.status = firstLength +','+secondLength;
one.height = firstLength;
two.height = secondLength;
}
}
var oldpos;
function clicker()
{
if(moveflag == 0)
{
moveflag = 1;
oldpos = window.event.y;
}
else
{
moveflag = 0;
}
}

</script>
<TABLE id="Table1" height="610px" cellPadding="1" border="1">
<TR id="one" height="300px">
<TD><iframe src="http://www.yahoo.com" height="100%"></iframe></TD>
</TR>
<tr height='1px'style="BACKGROUND-COLOR: red" onclick="clicker();">
<td style="HEIGHT: 1px" >click here move mouse up and down</td>
</tr>
<tr id="two" height="300px">
<TD><iframe src="http://www.yahoo.com" height="100%"></iframe></TD>
</tr>
</TABLE>
</body>
</html>

Khalid Ali
08-11-2004, 03:47 PM
make the following changes in your code.

HTML part of the code
replace you rcells height attribute with following
style="height:300px">

for both cells

and then use the following code in place of your own

var firstLength = parseInt(one.style.height) - parseInt(moveby);
var secondLength = parseInt(two.style.height) + parseInt(moveby);
self.status = firstLength +','+secondLength;
if(Number(firstLength)>0){
one.style.height = firstLength+"px";
}
if(Number(secondLength)>0){
two.style.height = secondLength+"px";
}

Vladdy
08-11-2004, 05:56 PM
Why is it table cell in the first place? :rolleyes: