Javascript for vertical text scroll breaking page layout
Question
My code was validating perfectly and looked great, until I added a vertical text scroller script to the left most floating div in a 3 column css layout. Adding the script causes content below the script to repeat - both text and backgrounds - in several modern browsers (IE 6.0 - 7.0 - 8.0, Opera 8 - 9- 10). Safari and Firefox are OK.
The script is JavaScript, and you add it by placing this code where you want the scroller to appear on the page, in my case inside the 3rd floated div:
<script language="javascript" src="myvsbody.js" type="text/javascript">
</script>
There is also an onload property that goes in the body tag:
<body onload="vsscrollstart();">
and a parameters script in the head area that formats the scroller box:
<script language="javascript" src="myvsparmsg.js" type="text/javascript">
The script is supposed to be cross browser compatible.
Here is the web page online and links to the code:
http://www.jillknobloch.com/new/
../new/main.css
../new/myvsbody.js
../new/myvsparmsg.js
I thought I had hold of a bad script, so I tried another one and the same layout problem reoccurred!! So I think it's my XHTML/CSS. Also because the script does work across all browsers when used in this template, which I got from template world and loaded on my site:
www.jillknobloch.com/test5/
I HAVE SPENT ABOUT 48 HOURS STARRING AT THE TEMPLATE WORLD PAGE TRYING TO FIND THE DIFFERENCE BETWEEN THAT CODE AND MINE AND I CANNOT FIGURE OUT WHY THE TEXT SCROLL SCRIPT WORKS ON THAT PAGE AND NOT ON MINE.
I am a new Javascipt programmer, and any help would be greatly appreciated!
Thank you
Jill Knobloch
1 answers
solution1
1 2009-11-05 23:26:36
I couldn't find anything wrong in the problematic browsers you mentioned, but the HTML validation error is caused by the language attribute on the script tags. It is not needed. Try this instead:
<script src="myvsbody.js" type="text/javascript"></script>
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.