PDA

View Full Version : I want image to change in Scrollable Menu Links



Anita23
04-01-2007, 07:54 AM
1) Script Title:
Scrollable Menu Links
DOM Image Rollover II
2) Script URL (on DD):
http://www.dynamicdrive.com/dynamicindex1/scrollerlink.htm
http://www.dynamicdrive.com/dynamicindex15/domroll2.htm
3) Describe problem:
I have on my site Scrollable Menu Links script. There are images instead of text. I want them to change after rollover, like in first example in DOM Image Rollover II.

jscheuer1
04-01-2007, 12:13 PM
OK, go ahead, looks like it should work unless there is an onload conflict (shouldn't be in modern browsers). Did you try it? Do you have a demo of your page?

Anita23
04-06-2007, 06:05 AM
This is my site:
http://www.anita23.topworld.org/index2.htmlhttp://www.anita23.topworld.org/index2.html
You must click on the "Gry" on the left.
It doesn't work.

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<HTML>
<HEAD>
<link rel="stylesheet" href="thumbnailviewer.css" type="text/css" />

<script src="thumbnailviewer.js" type="text/javascript">

/***********************************************
* Image Thumbnail Viewer Script- © Dynamic Drive (www.dynamicdrive.com)
* This notice must stay intact for legal use.
* Visit http://www.dynamicdrive.com/ for full source code
***********************************************/

</script>
<META HTTP-EQUIV="Content-type" CONTENT="text/html; charset=windows-1250">
<META NAME="Author" CONTENT="Anita23">
<META HTTP-EQUIV="Content-Language" CONTENT="pl">
<TITLE>Gry</TITLE>
<script language="JavaScript1.2">

//Highlight image script- By Dynamic Drive
//For full source code and more DHTML scripts, visit http://www.dynamicdrive.com
//This credit MUST stay intact for use

function makevisible(cur,which){
strength=(which==0)? 1 : 0.6

if (cur.style.MozOpacity)
cur.style.MozOpacity=strength
else if (cur.filters)
cur.filters.alpha.opacity=strength*100
}

</script>
<script type="text/javascript" src="oodomimagerollover.js">

/***********************************************
* DOM Image Rollover II- By Adam Smith (http://www.codevendor.com)
* Script featured on and available at Dynamic Drive (http://www.dynamicdrive.com)
* Keep this notice intact for usage please
***********************************************/

</script>

</HEAD>
<BODY background="http://img209.imageshack.us/img209/8307/cij6.jpg" style="scrollbar-base-color: #8C723C">


<p align=center><script type="text/javascript">

//configure path for left and right arrows
var goleftimage='pointer2.JPG'
var gorightimage='pointer.JPG'
//configure menu width (in px):
var menuwidth=450
//configure menu height (in px):
var menuheight=74
//Specify scroll buttons directions ("normal" or "reverse"):
var scrolldir="reverse"
//configure scroll speed (1-10), where larger is faster
var scrollspeed=6
//specify menu content
var menucontents='<nobr><a href="#1"><img src="http://www.xbox.com/NR/rdonlyres/240D0A96-207A-4756-B9D2-A9B0DA5BF314/0/HUDSON.jpg" srcover="http://www.xbox.com/NR/rdonlyres/504ADD6B-E118-4C14-ABEA-E30E2C1B60AB/0/scdasam104.png" width=64 height=64></a> <a href="#A"><img src="http://www.xbox.com/NR/rdonlyres/504ADD6B-E118-4C14-ABEA-E30E2C1B60AB/0/scdasam104.png" width=64 height=64></a> <a href="#B"><img src="http://www.xbox.com/NR/rdonlyres/30D16586-4CE6-45B1-AF42-91F97828113E/0/rainbow6vegas04.jpg" width=64 height=64></a> <a href="#C"><img src="http://www.xbox.com/NR/rdonlyres/470D69CC-92AA-46CF-8108-D2AE5990CCA9/0/gtnlgrawpack1002.jpg" width=64 height=64></a> <a href="#D"><img src="http://www.xbox.com/NR/rdonlyres/E8B1F1CB-655B-4C51-B9BC-53276047BE19/0/cod3brands02.jpg" width=64 height=64></a> <a href="#E"><img src="http://www.mapsofworld.com/2006-fifa-world-cup/maps/logo.jpg" width=64 height=64></a> <a href="#F"><img src="http://www.xbox.com/NR/rdonlyres/9B6713A7-F5E0-4A9F-AA6C-51E6A86B89D2/0/gtnlburnoutrevengepp3001.jpg" width=64 height=64></a> <a href="#G"><img src="http://www.xbox.com/NR/rdonlyres/9FA4C653-6B9F-4E54-A11B-21687FD7187B/0/gtnl64_daedricsymbol2.jpg" width=64 height=64></a> <a href="#H"><img src="http://www.xbox.com/NR/rdonlyres/F1F32872-9EE6-46AA-8C06-4B10C9D4CC00/0/picturepackagent471005.jpg" width=64 height=64></a> <a href="#I"><img src="http://newsimg.bbc.co.uk/media/images/41832000/jpg/_41832014_kong_ap_2006_203.jpg" width=64 height=64> <a href="#J"><img src="http://www.elite*******s.com/hanners/prey/preylogo.jpg" width=64 height=64></a> <a href="#K"><img src="http://xbox360.qj.net/uploads/articles_module/65354/saints_row_logo.jpg" width=64 height=64></a> <a href="#L"><img src="http://www.powerstore.nu/Power_admin/uploads/gears-of-war.jpg" width=64 height=64></a> <a href="#M"><img src="http://www.voodooclub.de/Tropico/Tropico.JPG" width=64 height=64></a> <a href="#N"><img src="http://www.thebeststuffintheworld.com/images/images_of_stuff/210x600/the-sims-2-993.jpg" width=64 height=64></a> <a href="#O"><img src="http://www.zanezane.net/articoli/MaveRick666/gta_next/gta%20san%20andreas.gif" width=64 height=64></a></nobr>'


var iedom=document.all||document.getElementById
var leftdircode='onMouseover="moveleft()" onMouseout="clearTimeout(lefttime)"'
var rightdircode='onMouseover="moveright()" onMouseout="clearTimeout(righttime)"'
if (scrolldir=="reverse"){
var tempswap=leftdircode
leftdircode=rightdircode
rightdircode=tempswap
}
if (iedom)
document.write('<span id="temp" style="visibility:hidden;position:absolute;top:-100;left:-5000">'+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_scrollmenu2
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.style.left)-scrollspeed+"px"
}
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.style.left)+scrollspeed+"px"
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="2">')
write('<td valign="middle"><a href="#" '+leftdircode+'><img src="'+goleftimage+'"border=0></a> </td>')
write('<td width="'+menuwidth+'px" valign="top">')
if (iedom){
write('<div style="position:relative;width:'+menuwidth+'px;height:'+menuheight+'px;overflow:hidden;">')
write('<div id="test2" style="position:absolute;left:0;top:0">')
write('</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="#" '+rightdircode+'>')
write('<img src="'+gorightimage+'"border=0></a>')
write('</td></table>')
}
}

</script></p>




<br><br>
<a name="1">
<img src="http://www.gameprotv.com/noticias/La_web_de_Viva_Pinata_se_relanza_con_Minijuegos/bb56t45t54705897_2.jpg" alt="Viva Pinata" width=230 height=300 vspace=5 hspace=15 align=right>
<font color=brown size=5>Viva Pinata
<div align="justify"><font color=brown size=4>
Viva Pinata jest skrzyżowaniem gry hodowlanej, strategicznej, symulatora życia i gry ekonomicznej. Naszym zadaniem jest hodowla w swoim ogródku dziwacznych stworków- Pinat. Możemy je dowolnie krzyżować i sprzedawać na Livie innym graczom. Możemy zbierać nowe rodzaje dzikich Pinat i próbować je oswoić.
W grze znajduje się 60 rodzajów żyjątek do hodowania. Plus mnóstwo zagrożeń czyhających na naszą zagrodę, którym trzeba będzie jakoś zaradzić. Na uwage zasluguje fakt, ye gra jest calkowicie po polsku!
</font></div>
<a href="http://www.valhalla.pl/img/Viva_Pinata_Xbox360/48761320061114_184006_8_big.jpg" rel="thumbnail"><img src="http://img80.imageshack.us/img80/8431/pinata1ly5.jpg" style="filter:alpha(opacity=20);-moz-opacity:0.6" onMouseover="makevisible(this,0)" onMouseout="makevisible(this,1)" width=90 height=60 align=center></a>
<a href="http://www.valhalla.pl/img/Viva_Pinata_Xbox360/48761320061114_184000_1_big.jpg" rel="thumbnail"><img src="http://img80.imageshack.us/img80/2668/pinata2ck5.jpg" style="filter:alpha(opacity=20);-moz-opacity:0.6" onMouseover="makevisible(this,0)" onMouseout="makevisible(this,1)" width=90 height=60 align=center></a>
<a href="http://www.valhalla.pl/img/Viva_Pinata_Xbox360/c4ca4238a0b92382.jpg" rel="thumbnail"><img src="http://img80.imageshack.us/img80/8369/pinata3zn8.jpg" style="filter:alpha(opacity=20);-moz-opacity:0.6" onMouseover="makevisible(this,0)" onMouseout="makevisible(this,1)" width=90 height=60 align=center></a>
<a href="http://www.valhalla.pl/img/Viva_Pinata_Xbox360/1679091c5a880faf.jpg" rel="thumbnail"><img src="http://img217.imageshack.us/img217/978/pinata4tr1.jpg" style="filter:alpha(opacity=20);-moz-opacity:0.6" onMouseover="makevisible(this,0)" onMouseout="makevisible(this,1)" width=90 height=60 align=center></a>
<a href="http://www.valhalla.pl/img/Viva_Pinata_Xbox360/48761320061114_184000_0_big.jpg" rel="thumbnail"><img src="http://img168.imageshack.us/img168/9600/pinata5gu4.jpg" style="filter:alpha(opacity=20);-moz-opacity:0.6" onMouseover="makevisible(this,0)" onMouseout="makevisible(this,1)" width=90 height=60 align=center></a>

</BODY>
</HTML>

Anita23
04-06-2007, 06:06 AM
This is a short version, but with all scripts and codes