CSS properties and DHTML
David
- dhtml
Hallo Everybody!
sorry my German is not fluent, so I will ask my question in english.
I want to make the equivalent of the <marquee> with DHTML (for working with all of the navigator). The result is this one:
<div id="divun" style="position:relative; background-color:#CCCCCC; width:150px; height:130px;">
<div id="divdeux" style="position:absolute; top:4px; left:4px; clip:rect(0px, 142px, 122px, 0px);">
<div id="textascroller"><p style="width:142px; margin:0px;">Bla bla, blabla....</p>
</div>
</div>
</div>
and the code of the Javascript-part:
var grad_scroll=50;
var montext;
function init()
{
montext = eval(document.getElementById("textascroller"));
montext.style.position = "absolute";
montext.style.top = grad_scroll;
scroll();
}
function scroll()
{
if (grad_scroll<-160) grad_scroll = 150;
grad_scroll --;
document.getElementById("textascroller").style.top = grad_scroll;
window.setTimeout("scroll()",50);
}
This is working very-well in HTML4.01 with IE6, Netscape7, opera7 and Mozilla5. The problem appear when I try my exemple in XHTML1.1, that's doesn't work with mozilla5 and Netscape7, why? My code is valid for CSS2.0 and xhtml1.1.
I think the problem came from the line "montext.style.top = grad_scroll;" but I'm not sure.
If you've got any idea, that will be very helpfull. Thank you.
@+
David.
Hi,
if (grad_scroll<-160) grad_scroll = 150;
grad_scroll --;
document.getElementById("textascroller").style.top = grad_scroll;
grad_scroll contains a number. style.top expects to get a length, i.e. a number followed by a unit like px, em, %, ex, pt...
Change that line to
document.getElementById("textascroller").style.top = "" + grad_scroll + "px";
cu,
Andreas
document.getElementById("textascroller").style.top = "" + grad_scroll + "px";
that's working very well now, thank you very much Andreas.
David.