Vertical Content Scroll

scroll.html

<style type="text/css">

#marqueecontainer{
position: relative;
width: auto; /*marquee width */
height: 200px; /*marquee height */
background-color: white;
overflow: hidden;
padding: 2px;
padding-left: 4px;
}

.notice-section{
	width: 200px;
	border: 2px solid #BC6F7B;
	border-radius: 10px;
	overflow: hidden;
}

.notice-section h4{
	padding: 5px 0;
	margin: 0;
	text-align: center;
	border-bottom: 2px solid #BC6F7B;
}

</style>

<script type="text/javascript">

/***********************************************
* Cross browser Marquee II- � Dynamic Drive (www.dynamicdrive.com)
* This notice MUST stay intact for legal use
* Visit http://www.dynamicdrive.com/ for this script and 100s more.
***********************************************/

var delayb4scroll=2000 //Specify initial delay before marquee starts to scroll on page (2000=2 seconds)
var marqueespeed=2 //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)) //if scroller hasn't reached the end of its height
cross_marquee.style.top=parseInt(cross_marquee.style.top)-copyspeed+"px" //move scroller upwards
else //else, reset to original position
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 //height of marquee content (much of which is hidden from view)
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()",30)', 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>


<div class="notice-section">
	<h4>Notice Board</h4>
	<div id="marqueecontainer" onMouseover="copyspeed=pausespeed" onMouseout="copyspeed=marqueespeed">
		<div id="vmarquee" style="position: absolute; width: 98%;">

		<!--YOUR SCROLL CONTENT HERE-->

		<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Dolorem, exercitationem.</p>
		<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Dolorem, exercitationem.</p>
		<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Dolorem, exercitationem.</p>
		<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Dolorem, exercitationem.</p>

		<!--YOUR SCROLL CONTENT HERE-->

		</div>
	</div>
</div>