I made this piece of code, which takes an element and increases it's height by 1 every millisecond. Then also decreases the height by 1 every millisecond.. to produce a scrolling "showing" and "hiding" effect. I want to use this on one of my menus but I got to thinking about the "flickering" every millisecond the element's height is updated.
Does this matter? Does the monitor control the "flickering"? Is that considered flickering or flashing when javascript updates the height? Is the element continually "updated" or is it redrawn with every iteration?
Sorry for the stupid question..........
Here is the code
Code: Select all
<html>
<head>
<title>test</title>
</head>
<body>
<script type="text/javascript">
function show(el, heightto, num)
{
if(num == heightto)
{
return;
}
document.getElementById(el).style.height = num+'px';
num=num+1;
setTimeout("show('"+el+"',"+heightto+", "+num+")", 1);
}
function showit(el)
{
document.getElementById(el).style.display = 'block';
}
function hide(el, heightto, num)
{
if(num == heightto)
{
document.getElementById(el).style.display = 'none';
return;
}
document.getElementById(el).style.height = num+'px';
num=num-1;
setTimeout("hide('"+el+"',"+heightto+", "+num+")", 1);
}
</script>
<a href="javascript:void(0);" onclick="showit('div1'); show('div1', 300, 0);">+++++++++</a>
<a href="javascript:void(0);" onclick="hide('div1', 0, 300);">---------</a>
<div id="div1" style="display: none; overflow: hidden; border: solid 1px #000;">stuff</div>
</body>
</html>