Scrolling Text
Demo:
Lorem ipsum dolor sit amet: consectetuer adipiscing elit. Integer vitae odio vitae augue rhoncus vehicula. Cras urna nisl, porttitor in, lacinia consequat, faucibus in, eros. Mauris porttitor interdum purus. Proin id ligula. Donec a arcu. Nullam fringilla malesuada sem. Aenean suscipit. Nullam magna ligula, tincidunt ac, malesuada eu, vulputate euismod, massa. Cras ipsum magna, iaculis vitae, tempus sed, suscipit et, nulla. Nulla sem lorem, volutpat nec, tincidunt et, nonummy ut, ante.
Donec metus. Nunc ac augue: Vivamus vel pede. Ut fringilla turpis nec libero. Nullam porta. Proin lacinia bibendum leo. Vestibulum eu metus in turpis tempor suscipit. Morbi gravida, nunc ac sagittis malesuada, urna orci lacinia mi, tempus hendrerit ligula ligula at dolor. Quisque risus purus, vulputate at, nonummy id, elementum eget, lacus. Fusce blandit adipiscing nisi.
Nam volutpat ornare velit: Mauris ut quam. Mauris ac lectus quis metus placerat gravida. Curabitur mi massa, sollicitudin a, luctus sed, lobortis eget, tortor. Integer sit amet dolor. Integer varius ipsum sed ipsum. Etiam feugiat erat sit amet diam. Sed nibh. Aliquam blandit molestie metus. Vestibulum tincidunt. Suspendisse potenti. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Praesent rhoncus dictum augue. In dictum nulla id libero. Ut nisi. Donec at ante non mauris viverra hendrerit. Suspendisse ante.
Lorem ipsum dolor sit amet: consectetuer adipiscing elit. Aenean in velit vitae arcu tristique tincidunt. Suspendisse potenti. Proin ante libero, molestie nec, ornare at, placerat vel, risus. Etiam consectetuer ante a nunc. Cras euismod, erat in consectetuer malesuada, massa velit accumsan sem, vulputate mattis arcu justo eu mauris. Vivamus convallis placerat eros. Sed orci augue, sollicitudin eget, auctor hendrerit, congue ac, velit. Praesent gravida suscipit lectus. In eros. Phasellus libero. Integer a sem eu tortor adipiscing accumsan. Donec nonummy tortor at lorem. Nulla et libero sit amet est aliquam molestie.
Nulla ultrices magna sit amet enim: Praesent tincidunt augue sed elit. Nulla rhoncus, magna eu tristique malesuada, dolor leo eleifend velit, et consequat sapien metus in orci. Donec leo sapien, nonummy at, lacinia eu, ullamcorper sed, mauris. Aliquam hendrerit lacus in pede. Nam sapien orci, blandit fermentum, feugiat quis, tempus eget, purus. Integer tempor sollicitudin sem. Phasellus arcu. In hac habitasse platea dictumst. Maecenas dictum.
|
|
Simply add the bellow code where you need the scroll to be visible.
<table width="375" height="160" border="0" cellpadding="0" cellspacing="0" style="border: 1px solid #FFFFFF;">
<tr>
<td width="355" style="border-right: 1px solid #FFFFFF;">
<SCRIPT language="JavaScript1.2">
var speed=2 iens6=document.all||document.getElementById
ns4=document.layers
if (iens6){
document.write('<div id="container" style="position:relative;width:355px;height:160px;overflow:hidden;border:0px ridge white">')
document.write('<div id="content" style="position:absolute;width:355px;left:0px;top:0px">')
}
</script>
<ilayer name="nscontainer" width=155 height=160 clip="0,0,155,160">
<layer name="nscontent" width=155 height=160 visibility=hidden>
<!--Add your conent here-->
<b><u>Lorem ipsum dolor sit amet: </u></b> consectetuer adipiscing elit. Integer vitae odio vitae augue rhoncus vehicula. Cras urna nisl, porttitor in, lacinia consequat, faucibus in, eros. Mauris porttitor interdum purus. Proin id ligula. Donec a arcu. Nullam fringilla malesuada sem. Aenean suscipit. Nullam magna ligula, tincidunt ac, malesuada eu, vulputate euismod, massa. Cras ipsum magna, iaculis vitae, tempus sed, suscipit et, nulla. Nulla sem lorem, volutpat nec, tincidunt et, nonummy ut, ante. <br /><br /><b><u>Donec metus. Nunc ac augue: </u></b> Vivamus vel pede. Ut fringilla turpis nec libero. Nullam porta. Proin lacinia bibendum leo. Vestibulum eu metus in turpis tempor suscipit. Morbi gravida, nunc ac sagittis malesuada, urna orci lacinia mi, tempus hendrerit ligula ligula at dolor. Quisque risus purus, vulputate at, nonummy id, elementum eget, lacus. Fusce blandit adipiscing nisi. <br /><br /><b><u>Nam volutpat ornare velit: </u></b> Mauris ut quam. Mauris ac lectus quis metus placerat gravida. Curabitur mi massa, sollicitudin a, luctus sed, lobortis eget, tortor. Integer sit amet dolor. Integer varius ipsum sed ipsum. Etiam feugiat erat sit amet diam. Sed nibh. Aliquam blandit molestie metus. Vestibulum tincidunt. Suspendisse potenti. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Praesent rhoncus dictum augue. In dictum nulla id libero. Ut nisi. Donec at ante non mauris viverra hendrerit. Suspendisse ante. <br /><br /><b><u>Lorem ipsum dolor sit amet: </u></b> consectetuer adipiscing elit. Aenean in velit vitae arcu tristique tincidunt. Suspendisse potenti. Proin ante libero, molestie nec, ornare at, placerat vel, risus. Etiam consectetuer ante a nunc. Cras euismod, erat in consectetuer malesuada, massa velit accumsan sem, vulputate mattis arcu justo eu mauris. Vivamus convallis placerat eros. Sed orci augue, sollicitudin eget, auctor hendrerit, congue ac, velit. Praesent gravida suscipit lectus. In eros. Phasellus libero. Integer a sem eu tortor adipiscing accumsan. Donec nonummy tortor at lorem. Nulla et libero sit amet est aliquam molestie. <br /><br /><b><u>Nulla ultrices magna sit amet enim: </u></b> Praesent tincidunt augue sed elit. Nulla rhoncus, magna eu tristique malesuada, dolor leo eleifend velit, et consequat sapien metus in orci. Donec leo sapien, nonummy at, lacinia eu, ullamcorper sed, mauris. Aliquam hendrerit lacus in pede. Nam sapien orci, blandit fermentum, feugiat quis, tempus eget, purus. Integer tempor sollicitudin sem. Phasellus arcu. In hac habitasse platea dictumst. Maecenas dictum.<br /><br />
<!--Your content ends here-->
</layer>
</ilayer>
<script language="JavaScript1.2">
if (iens6){
document.write('</div></div>')
var crossobj=document.getElementById? document.getElementById("content") : document.all.content
var contentheight=crossobj.offsetHeight
}
else if (ns4){
var crossobj=document.nscontainer.document.nscontent
var contentheight=crossobj.clip.height
}
function movedown(){
if (window.moveupvar) clearTimeout(moveupvar)
if (iens6&&parseInt(crossobj.style.top)>=(contentheight*(-1)+100))
crossobj.style.top=parseInt(crossobj.style.top)-speed+"px"
else if (ns4&&crossobj.top>=(contentheight*(-1)+100))
crossobj.top-=speed
movedownvar=setTimeout("movedown()",20)
}
function moveup(){
if (window.movedownvar) clearTimeout(movedownvar)
if (iens6&&parseInt(crossobj.style.top)<=0)
crossobj.style.top=parseInt(crossobj.style.top)+speed+"px"
else if (ns4&&crossobj.top<=0)
crossobj.top+=speed
moveupvar=setTimeout("moveup()",20)
}
function stopscroll(){
if (window.moveupvar) clearTimeout(moveupvar)
if (window.movedownvar) clearTimeout(movedownvar)
}
function movetop(){
stopscroll()
if (iens6)
crossobj.style.top=0+"px"
else if (ns4)
crossobj.top=0
}
function getcontent_height(){
if (iens6)
contentheight=crossobj.offsetHeight
else if (ns4)
document.nscontainer.document.nscontent.visibility="show"
}
window.onload=getcontent_height
</script>
</td>
<td>
<table width="15" height="160" border="0" cellpadding="0" cellspacing="0" style="border: 1px solid #FFFFFF;">
<tr>
<td align="center" valign="top" style="border-bottom: 1px solid #FFFFFF;"><a href="javascript:moveup()"><img src="images/up_arrow.jpg" border="0" width="21" height="21"></a></td>
</tr>
<tr>
<td align="center" valign="bottom"><a href="javascript:movedown()"><img src="images/down_arrow.jpg" border="0" width="21" height="21"></a></td>
</tr>
</table>
</td>
</tr>
</table>
|