Skip to content

JavaScript Marquee

June 30, 2010

Copy the following code in a js file and simply drag and drop the js file in proper place where to get the marquee.

It can also use by putting directly to any page when the java script <> tag bar must be used to recognize by the server.

//Specify the marquee’s width (in pixels)

var marqueewidth=”1300px”

//Specify the marquee’s height

var marqueeheight=”25px”

//Specify the marquee’s marquee speed (larger is faster 1-10)

var marqueespeed=2

//configure background color:

var marqueebgcolor=”#1B3266″

//Pause marquee onMousever (0=no. 1=yes)?

var pauseit=1

//Specify the marquee’s content (don’t delete <nobr> tag)

//Keep all content on ONE line, and backslash any single quotations (ie: that\’s great):

var marqueecontent='<nobr><font face=”Arial”>Thank you for visiting this page.</font></nobr>’

////NO NEED TO EDIT BELOW THIS LINE////////////

marqueespeed=(document.all)? marqueespeed : Math.max(1, marqueespeed-1) //slow speed down by 1 for NS

var copyspeed=marqueespeed

var pausespeed=(pauseit==0)? copyspeed: 0

var iedom=document.all||document.getElementById

if (iedom)

document.write(‘<span id=”temp” style=”visibility:hidden;position:absolute;top:-100px;left:-9000px”>’+marqueecontent+'</span>’)

var actualwidth=”

var cross_marquee, ns_marquee

function populate(){

if (iedom){

cross_marquee=document.getElementById? document.getElementById(“iemarquee”) : document.all.iemarquee

cross_marquee.style.left=parseInt(marqueewidth)+8+”px”

cross_marquee.innerHTML=marqueecontent

actualwidth=document.all? temp.offsetWidth : document.getElementById(“temp”).offsetWidth

}

else if (document.layers){

ns_marquee=document.ns_marquee.document.ns_marquee2

ns_marquee.left=parseInt(marqueewidth)+8

ns_marquee.document.write(marqueecontent)

ns_marquee.document.close()

actualwidth=ns_marquee.document.width

}

lefttime=setInterval(“scrollmarquee()”,20)

}

window.onload=populate

function scrollmarquee(){

if (iedom){

if (parseInt(cross_marquee.style.left)>(actualwidth*(-1)+8))

cross_marquee.style.left=parseInt(cross_marquee.style.left)-copyspeed+”px”

else

cross_marquee.style.left=parseInt(marqueewidth)+8+”px”

}

else if (document.layers){

if (ns_marquee.left>(actualwidth*(-1)+8))

ns_marquee.left-=copyspeed

else

ns_marquee.left=parseInt(marqueewidth)+8

}

}

if (iedom||document.layers){

with (document){

document.write(‘<table border=”0″ cellspacing=”0″ cellpadding=”0″><td>’)

if (iedom){

write(‘<div style=”position:relative;width:’+marqueewidth+’;height:’+marqueeheight+’;overflow:hidden”>’)

write(‘<div style=”position:absolute;width:’+marqueewidth+’;height:’+marqueeheight+’;background-color:’+marqueebgcolor+'” onMouseout=”copyspeed=marqueespeed”>’)

write(‘<div id=”iemarquee” style=”position:absolute;left:0px;top:0px”></div>’)

write(‘</div></div>’)

}

else if (document.layers){

write(‘<ilayer width=’+marqueewidth+’ height=’+marqueeheight+’ name=”ns_marquee” bgColor=’+marqueebgcolor+’>’)

write(‘<layer name=”ns_marquee2″ left=0 top=0 onMouseover=”copyspeed=pausespeed”></layer>’)

write(‘</ilayer>’)

}

document.write(‘</td></table>’)

}

}

Advertisements

From → Web Application

Leave a Comment

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

%d bloggers like this: