Vertical Text Scroller in Javascript

By Ankit Goyal | April 1, 2009 | 738 views
Category .NET

About author Working on .NET technologies for past 2yrs. I am very passionate about the new features which get introduced in the technology. I am here to share the new features i get to know in the world of Microsoft. Follow me on twitter @ankygoyal Read more from this author

Well the task is to create a vertical text scroller.

It can be done using the javascript code.

Let me explain the process:

First of all lets make the form scrolling. So,In the html form do the following add the following attributes to the body tag onMouseover="scrollspeed=0" onMouseout="scrollspeed=current" OnLoad="NewsScrollStart();"

And the javascript functions used above are as follows:

<script language="JavaScript" type="text/javascript">
//<!-- HIDE CODE 

var scrollspeed = "1" // SET SCROLLER SPEED 1 = SLOWEST
var speedjump = "30" // ADJUST SCROLL JUMPING = RANGE 20 TO 40
var startdelay = "2" // START SCROLLING DELAY IN SECONDS
var nextdelay = "0" // SECOND SCROLL DELAY IN SECONDS 0 = QUICKEST
var topspace = "2px" // TOP SPACING FIRST TIME SCROLLING
var frameheight = "200px" // IF YOU RESIZE THE WINDOW EDIT THIS HEIGHT TO MATCH 

current = (scrollspeed) 

function HeightData(){
AreaHeight=dataobj.offsetHeight
if (AreaHeight==0){
setTimeout("HeightData()",( startdelay * 1000 ))
}
else {
ScrollNewsDiv()
}} 

function NewsScrollStart(){
dataobj=document.all? document.all.NewsDiv : document.getElementById("NewsDiv")
dataobj.style.top=topspace
setTimeout("HeightData()",( startdelay * 1000 ))
} 

function ScrollNewsDiv(){
dataobj.style.top=parseInt(dataobj.style.top)-(scrollspeed)
if (parseInt(dataobj.style.top)<AreaHeight*(-1)) {
dataobj.style.top=frameheight
setTimeout("ScrollNewsDiv()",( nextdelay * 1000 ))
}
else {
setTimeout("ScrollNewsDiv()",speedjump)
}} 

// END HIDE CODE -->
</script>

Inside the body tag create a div element with id=”NewsDiv”
In the code behind add labels with text per line into this div as shown below

///
/// Handles the Load event of the Page control.
///
/// The source of the event.
/// The instance containing the event data.
protected void Page_Load(object sender, EventArgs e)
{
GenerateAlert();
}
// Private Methods (1)

///
/// this method extracts the alerts and show them in a label
///
private void GenerateAlert()
{
XmlDocument xmldoc = new XmlDocument();
xmldoc.Load(Server.MapPath(“../XML Files/GlobalDisasters.xml”));
XmlNodeList xmlndlst = xmldoc.GetElementsByTagName(“title”);

for (int i = 0; i < xmlndlst.Count; i++)
{
lblAlert = new Label();
string strTitle = xmlndlst[i].InnerText.ToString();
lblAlert.Text = strTitle + “