View Full Version : scrollable menu links


swtgrl55
04-12-2003, 02:03 AM
I got a code from dynamicdrive but i can't use it... heres the code... what am I doing wrong??

<style>
body{
overflow-x:hidden;
overflow-y:scroll;
}
</style>

<script language="JavaScript1.2">

/*
Scrollable Menu Links- By Dynamicdrive.com
For full source, TOS, and 100s DTHML scripts
Visit http://www.dynamicdrive.com
*/

//configure path for left and right arrows
var goleftimage='pointer2.gif'
var gorightimage='pointer.gif'
//configure menu width
var menuwidth=300
//configure menu height
var menuheight=25
//configure scroll speed (1-10), where larger is faster
var scrollspeed=6
//specify menu content
var menucontents='<nobr><a href="http://www.freewebs.com/lilaznboy48/index.htm">Tony's site...</a> | <a href="http://www.xanga.com/home.aspx?user=XxCoNfuSedMoOerxX">XxCoNfuSedMoOerxX's Xanga </a> | <a href="http://www.lissaexplains.com">Lissa Explains (HTML Help)</a> | <a href="http://www.angelfire.com">Get your own Angelfire website</a> | <a href="http://www.thespark.com">Tests....</a></nobr>'


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

var iedom=document.all||document.getElementById
if (iedom)
document.write('<span id="temp" style="visibility:hidden;position:absolute;top:-100;left:-1000">'+menucontents+'</span>')
var actualwidth=''
var cross_scroll, ns_scroll
var loadedyes=0
function fillup(){
if (iedom){
cross_scroll=document.getElementById? document.getElementById("test2") : document.all.test2
cross_scroll.innerHTML=menucontents
actualwidth=document.all? cross_scroll.offsetWidth : document.getElementById("temp").offsetWidth
}
else if (document.layers){
ns_scroll=document.ns_scrollmenu.document.ns_scrol lmenu2
ns_scroll.document.write(menucontents)
ns_scroll.document.close()
actualwidth=ns_scroll.document.width
}
loadedyes=1
}
window.onload=fillup

function moveleft(){
if (loadedyes){
if (iedom&&parseInt(cross_scroll.style.left)>(menuwidth-actualwidth)){
cross_scroll.style.left=parseInt(cross_scroll.styl e.left)-scrollspeed
}
else if (document.layers&&ns_scroll.left>(menuwidth-actualwidth))
ns_scroll.left-=scrollspeed
}
lefttime=setTimeout("moveleft()",50)
}

function moveright(){
if (loadedyes){
if (iedom&&parseInt(cross_scroll.style.left)<0)
cross_scroll.style.left=parseInt(cross_scroll.styl e.left)+scrollspeed
else if (document.layers&&ns_scroll.left<0)
ns_scroll.left+=scrollspeed
}
righttime=setTimeout("moveright()",50)
}

if (iedom||document.layers){
with (document){
write('<table border="0" cellspacing="0" cellpadding="0">')
write('<td valign="middle"><a href=#" onMouseover="moveleft()" onMouseout="clearTimeout(lefttime)"><img src="'+goleftimage+'"border=0></a> </td>')
write('<td valign="top">')
if (iedom){
write('<div style="position:relative;width:'+menuwidth+';">')
write('<div style="position:absolute;width:'+menuwidth+';height:'+men uheight+';overflow:hidden;">')
write('<div id="test2" style="position:absolute;left:0;top:0">')
write('</div></div></div>')
}
else if (document.layers){
write('<ilayer width='+menuwidth+' height='+menuheight+' name="ns_scrollmenu">')
write('<layer name="ns_scrollmenu2" left=0 top=0></layer></ilayer>')
}
write('</td>')
write('<td valign="middle"> <a href="#" onMouseover="moveright()" onMouseout="clearTimeout(righttime)">')
write('<img src="'+gorightimage+'"border=0></a>')
write('</td></table>')
}
}
</script>

MaGiCSuN
04-12-2003, 10:38 AM
where on the page do you add the script?

if it's in the <head> part then you must read this carefully:

Simply insert the below where you wish the scrollable menu to appear:

So you have to add it somewhere between the <body> and </body> part to let it appear on the right place

Love,
Mirna

epolady
04-12-2003, 11:55 AM
I'm not exactly sure what you did wrong with the script, but try downloading it again, but this time with your links, try something like this

<nobr><a href="http://www.freewebs.com/lilaznboy48/index.htm">Tony\'s site...</a> | <a href="http://www.xanga.com/home.aspx?user=XxCoNfuSedMoOerxX">XxCoNfuSedMoOerxX\'s Xanga </a> | <a href="http://www.lissaexplains.com">Lissa Explains (HTML Help)</a> | <a href="http://www.angelfire.com">Get your own Angelfire website</a> | <a href="http://www.thespark.com">Tests....</a></nobr>

Javascript is very testy with the apostrophes (i.e. I'm, you're, etc), so place a slash in front of the apostrophe will make it act like an apostrophe and not apart of the script itself. Hope this helps.

swtgrl55
04-12-2003, 05:06 PM
thank you both!