Please i need some help with js

this is what i got:

function roll(id,h){
//menu = document.getElementById(id);
cont+=1;
document.getElementById(id).style.height = cont;
t=setTimeout("roll('"+id+"',"+h+")",100);
if (cont > h){
cont=1;
stop();
}
}

this should resize a layer's height like an animated dropdown menu ... but it simply won't assign the new height.tryied also:

function roll(id,h){
menu = document.getElementById(id);
cont+=1;
menu.style.height = cont;
t=setTimeout("roll('"+id+"',"+h+")",100);
if (cont > h){
cont=1;
stop();
}
}

stop does nothing but:
function stop(){
if (running){
running=false;
clearTimeout(t);
};
}

stops the timeout.what is the problem?

DivX

Newbie Poster

3 posts since Jul 2005

Reputation Points: 10

Solved Threads: 0

6 Years Ago

0

This works for me in IE and Moz...

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Grow Layer Animation</title>
<script type="text/javascript">
function animateLayers(id,size) {
el = document.getElementById(id).style;
  var h_size1 = parseInt(el.height);
   if(h_size1 < size) {
    el.height = h_size1+2+"px";
    setTimeout("animateLayers('" + id + "','" + size + "')", 1);
  }
}
</script>
</head>
<body onload="animateLayers('Layer1','500')">
<div id="Layer1" style="position:absolute; width:33px; height:23px; z-index:1; left: 256px; top: 0px; background-color: #996600;"></div>
</body>
</html>

Eddie Traversa

DHTML Nirvana
http://dhtmlnirvana.com/

Spiritual Blog
http://www.truthrealization.com/

Eddie Traversa

Newbie Poster

20 posts since Jul 2005

Reputation Points: 11

Solved Threads: 0

6 Years Ago

0

You could also use offsetHeight instead of parseInt like so;

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Grow Layer Animation</title>
<script type="text/javascript">
function animateHeight(id,size) {
el = document.getElementById(id);
  var h_size1 =el.offsetHeight;
   if(h_size1 < size) {
    el.style.height = h_size1+2+"px";
    setTimeout("animateHeight('" + id + "','" + size + "')", 1);
  }
}
</script>
</head>
<body onload="animateHeight('Layer1','500')">
<div id="Layer1" style="position:absolute; width:33px; height:23px; z-index:1; left: 256px; top: 80px; background-color: #996600;"></div>
</body>
</html>

Eddie Traversa

DHTML Nirvana
http://dhtmlnirvana.com/

Spiritual Blog
http://www.truthrealization.com/index.php

Eddie Traversa

Newbie Poster

20 posts since Jul 2005

Reputation Points: 11

Solved Threads: 0

6 Years Ago

0

still won't work.
i think the problem is that my div contains severeal ancors:
here's one of the layers that won't work:

#submenu1{
filter:alpha(opacity=80,style=0);
position:absolute;
top:20;
left:20;
border: 1px solid black;
width: 120px;
background-color: #003466;
visibility : hidden;
z-index:1;

}

#submenu1 a{
font: bold 10px Verdana;
padding: 2px;
padding-left: 4px;
display: block;
width: 100%;
color: #FFFFFF;
text-decoration: none;
}

html>body #submenu1 a{
width: auto;
}

#submenu1 a:hover{
background-color: #5AB227;
color: white;
}

inside html:

Profilul Companiei
Scurt istoric
Showroom
Politica noastra
Despre Adeserv

and the function onmouseover looks like this:

this shows the popup menu layer near a object ...
but the browser won't allow me to change the height ..not even in the showmenu function...

DivX

Newbie Poster

3 posts since Jul 2005

Reputation Points: 10

Solved Threads: 0