DaniWeb IT Discussion Community

DaniWeb IT Discussion Community (http://www.daniweb.com/forums/index.php)
-   JavaScript / DHTML / AJAX (http://www.daniweb.com/forums/forum117.html)
-   -   Please i need some help with js (http://www.daniweb.com/forums/thread28586.html)

DivX Jul 20th, 2005 5:59 pm
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?

Eddie Traversa Jul 21st, 2005 5:51 am
Re: Please i need some help with js
 
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 Jul 21st, 2005 6:00 am
Re: Please i need some help with js
 
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

DivX Jul 21st, 2005 6:12 am
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...

Eddie Traversa Jul 21st, 2005 6:23 am
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/

DivX Jul 21st, 2005 6:26 am
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...


All times are GMT -4. The time now is 4:52 am.

Forum system based on vBulletin Copyright ©2000 - 2009, Jelsoft Enterprises Ltd.
©2003 - 2009 DaniWeb® LLC