Scrolling Text with jQuery

This is my absolute first attempt at jQuery, so don't assume that I know what I'm doing...

Reload the page to see it again.

This text scrolls up like movie credits:

Lonnie Smith
Idris Muhammad
Ronnie Cuber
Stanley Turrentine
Henry Miller
Anais Nin
Raymond Carver

The below is supposed to scroll right to left. Works in Firefox. Not working in IE (at least IE 6 running under Wine in Ubuntu):

Lonnie Smith, Idris Muhammad, Ronnie Cuber, Stanley Turrentine

Here's the code:

<html>
<head>
<script type="text/javascript" src="jquery-1.1.3.1.js"></script>

<script type="text/javascript">

$(document).ready(function() {
  $("#text").animate(
    {top: ($("#text").height() - ($("#text").parent().height() * 2))},
    10000
  );

  // broken in IE 6 (wine)
  $("#text2").animate(
    {left: ($("#text2").width() - $("#text2").parent().width() - $("#text2").parent().width())},
    10000
  );

});

</script>

</head>
<body>

<div style="background-color: lightgray;
            width:300px;
            height:150px;
            overflow:hidden;">
  <div id="text" style="position:relative;
                        top:0;
                        left;0;">
  Lonnie Smith<br>
  Idris Muhammad<br>
  Ronnie Cuber<br>
  Stanley Turrentine<br>
</div>
</div>
<div style="background-color: lightgray;
            width:300px;
            height:150px;
            overflow:hidden;">
  <div id="text2" style="position:relative;
                        top:0;
                        left;0;">
  Lonnie Smith, Idris Muhammad, Ronnie Cuber, Stanley Turrentine
  </div>
</div>

</body>
</html>

...nwood...

Navigation

User login

Syndicate

Scrolling Text with jQuery

Comments

More work needed