Ad:

JavaScript / DHTML / AJAX Discussion Thread
Unsolved
Views: 2587

Jul 20th, 2005

Please i need some help with js

Expand Post »

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

Reputation Points: 10

Solved Threads: 0

Newbie Poster

Offline

3 posts
since Jul 2005

Permalink

Jul 21st, 2005

Re: Please i need some help with js

This works for me in IE and Moz...

JavaScript / DHTML / AJAX Syntax (Toggle Plain Text)
<!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>
<!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

Reputation Points: 11

Solved Threads: 0

Newbie Poster

Offline

20 posts
since Jul 2005

Permalink

Jul 21st, 2005

Re: Please i need some help with js

You could also use offsetHeight instead of parseInt like so;

JavaScript / DHTML / AJAX Syntax (Toggle Plain Text)
<!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>
<!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

Reputation Points: 11

Solved Threads: 0

Newbie Poster

Offline

20 posts
since Jul 2005

Permalink

Jul 21st, 2005

Re: Please i need some help with js

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:
<div id="submenu1">
<a href="http://www.mywebsite.com" >Profilul Companiei</a>
<a href="http://www.mywebsite.com">Scurt istoric</a>
<a href="http://www.mywebsite.com/">Showroom</a>
<a href="http://www.mywebsite.com">Politica noastra</a>
<a href="http://www.mywebsite.com">Despre Adeserv</a>
</div>

and the function onmouseover looks like this:

function showmenu(obj,id){
var menu = document.getElementById(id);
if(menu.style.visibility == 'hidden'){
if(id=="submenu5"){
menu.style.top = document.body.topMargin + obj.offsetTop+90;
menu.style.left = document.body.leftMargin + obj.offsetLeft+460;
}else{
removeall();
menu.style.top = getAbsY(obj)+obj.offsetHeight;
menu.style.left = document.body.leftMargin + obj.offsetLeft;
//alert(menu.offsetHeight);
}
menu.style.visibility = 'visible';
start(id,menu.offsetTop);
}

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

DivX

Reputation Points: 10

Solved Threads: 0

Newbie Poster

Offline

3 posts
since Jul 2005

Permalink

Jul 21st, 2005

Re: Please i need some help with js

Post a page somewhere so I can see the whole code.

I can see one problem in the script

if(id=="submenu5"){

It doesnt look like your defining the id attribute so try something like this..

if(menu.id=="submenu5"){

Eddie Traversa

DHTML Nirvana
http://dhtmlnirvana.com/

Spiritual Blog

http://www.truthrealization.com/

Eddie Traversa

Reputation Points: 11

Solved Threads: 0

Newbie Poster

Offline

20 posts
since Jul 2005

Permalink

Jul 21st, 2005

Re: Please i need some help with js

the submenu5 is for a special submenu layer... it must appear as a submenu and that's why i had to put it in an if clause...

DivX

Reputation Points: 10

Solved Threads: 0

Newbie Poster

Offline

3 posts
since Jul 2005

This thread is more than three months old

No one has posted to this discussion for at least three months. Please let old threads die and do not reply to them unless you feel you have something new and valuable to contribute that absolutely must be added to make the discussion complete. Otherwise, please start a new thread in this forum instead.

Previous Thread in JavaScript / DHTML / AJAX Forum Timeline: setting value is not sticking

Next Thread in JavaScript / DHTML / AJAX Forum Timeline: Javascript , PLEASE HELP

DaniWeb Message

Cancel Changes

User Name
Password