Hello. I was wondering how to make a text box with the content in the box rotates like this one at: interwestcapital.com Also how to make it stop on mouseover. Any input would be appreciated. Thanks.
You can make it with a marquee. Something like: <MARQUEE behavior= "scroll" align= "center" direction= "down" scrollamount= "2" scrolldelay= "90" onmouseover='this.stop()' onmouseout=\'this.start()\'> SCROLLED CONTENT </MARQUEE> Code (markup): ...could work. Good luck
<html> <head> <script type="text/javascript"> var delayb4scroll=1000 //Specify initial delay before marquee starts to scroll on page (2000=2 seconds) var marqueespeed=1//Specify marquee scroll speed (larger is faster 1-10) var pauseit=1 //Pause marquee onMousever (0=no. 1=yes)? ////NO NEED TO EDIT BELOW THIS LINE//////////// var copyspeed=marqueespeed var pausespeed=(pauseit==0)? copyspeed: 0 var actualheight='' function scrollmarquee(){ if (parseInt(cross_marquee.style.top)>(actualheight*(-1)+8)) cross_marquee.style.top=parseInt(cross_marquee.style.top)-copyspeed+"px" else cross_marquee.style.top=parseInt(marqueeheight)+8+"px" } function initializemarquee(){ cross_marquee=document.getElementById("vmarquee") cross_marquee.style.top=0 marqueeheight=document.getElementById("marqueecontainer").offsetHeight actualheight=cross_marquee.offsetHeight if (window.opera || navigator.userAgent.indexOf("Netscape/7")!=-1){ //if Opera or Netscape 7x, add scrollbars to scroll and exit cross_marquee.style.height=marqueeheight+"px" cross_marquee.style.overflow="scroll" return } setTimeout('lefttime=setInterval("scrollmarquee()",60)', delayb4scroll) } if (window.addEventListener) window.addEventListener("load", initializemarquee, false) else if (window.attachEvent) window.attachEvent("onload", initializemarquee) else if (document.getElementById) window.onload=initializemarquee </script> </head> <body> <div id="marqueecontainer" onMouseOver="copyspeed=pausespeed" onMouseOut="copyspeed=marqueespeed"> <div id="vmarquee" style="position: absolute; width: 100%;"> <!--YOUR SCROLL CONTENT HERE--> <ul> <li>Hi, i'm a line!</li> <li>Hi, i'm a line, too!</li> </ul> <!--YOUR SCROLL CONTENT HERE--> </div> </div> <table width="100%" border="0" cellspacing="0" cellpadding="0" class="verdana10"> <tr> <td class="style1" colspan="2" align="right"><a href="news.html" class="style1" target="_top"><strong>more</strong></a></td> </tr> </table> </body> </html> HTML: Is this what you want? Hope it helps.