views:

181

answers:

2

Text Scrolling doesn't work in firefox (In IE it does).

Markup + javascript:

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"&gt;
<html lang="en">
  <head>
     <script type="text/javascript" language="javascript">

        var scrollspeed = "1";   
        var speedjump = "30";                                       
        var interval = "";
        var current;

        current = (scrollspeed);



        function ScrollDiv() {
            dataobj.style.top = parseInt(dataobj.style.top) - (scrollspeed);

            if (parseInt(dataobj.style.top) < AreaHeight * (-1)) {
                //restart
                dataobj.style.top = "200px";               
            }
            else {

            }
        }
        function ScrollStart() {
            dataobj = document.getElementById("NewsDiv");
            dataobj.style.top = "2px";
            AreaHeight = dataobj.offsetHeight;

            interval = setInterval("ScrollDiv()", speedjump);

        }
   </script>
  </head>
  <body  onmouseover="scrollspeed=0" onmouseout="scrollspeed=current" onload="ScrollStart();">
  <div id="NewsDiv">
   <table cellpadding="5" cellspacing="0" border="0" width="100%">
      <tr>
        <td>
            <span class="title">Website News1<br /></span>
            BLA BLA BLA BLA BLA BLA BLA BLA BLA BLA BLA BLA BLA BLA BLA BLA BLA BLA BLA BLA BLA BLA BLA BLA 
            <br /><br />

            <span class="title">Website News2<br /></span>
            BLA BLA BLA BLA BLA BLA BLA BLA BLA BLA BLA BLA BLA BLA BLA BLA BLA BLA BLA BLA BLA BLA BLA BLA 
            <br /><br />

            <span class="title">Website News3<br></span>
            BLA BLA BLA BLA BLA BLA BLA BLA BLA BLA BLA BLA BLA BLA BLA BLA BLA BLA BLA BLA BLA BLA BLA BLA 
            <br /><br />
        </td>
      </tr>
   </table>
</div>

</body>

CSS:

body
{
     margin-top: 0px;
     margin-right: 0px;
     margin-bottom: 0px;
     margin-left: 0px;
}        
#NewsDiv
{ 
     position: absolute;
     left: 0px;
     top: 0px; 
     width: 100%;
 }

Online (if still avaiable): http://www.webdevout.net/test?015&amp;raw

+1  A: 

You need to add "px" to the new value for dataobj.style.top.

function ScrollDiv() {
    dataobj.style.top = (parseInt(dataobj.style.top) - (scrollspeed)) + "px";

IE "incorrectly" assumes it is a pixel value. Firefox does not and gives you an error.

Atli
A: 

HI;

Not specifying units in a declaration for "top" will cause an error in Firefox; this is exactly what your problem is.

Change this line:

dataobj.style.top = parseInt(dataobj.style.top) - (scrollspeed);

To this:

dataobj.style.top = parseInt(dataobj.style.top) - (scrollspeed) + "px";

and it will work. Tested & working on FF3.5

Erik