Avatar billede peter277 Nybegynder
29. november 2003 - 11:38

Show layer

Hej,

Jeg har et script som skifter billedet efter x antal sekunder. Når musen kommer over billedet, vil jeg gerne have at et skjult lag kommer frem (mouseover)! Derudover kunne det være fedt, at når man klikker på billedet, så linker det et andet sted hen......

<html>
<head>

<script language="javascript">   

</script>

<script language="JavaScript" type="text/JavaScript">
<!--
function MM_reloadPage(init) {  //reloads the window if Nav4 resized
  if (init==true) with (navigator) {if ((appName=="Netscape")&&(parseInt(appVersion)==4)) {
    document.MM_pgW=innerWidth; document.MM_pgH=innerHeight; onresize=MM_reloadPage; }}
  else if (innerWidth!=document.MM_pgW || innerHeight!=document.MM_pgH) location.reload();
}
MM_reloadPage(true);
//-->
</script>

<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"></head>

<body bgcolor="#FFFFFF" text="#FFFFFF" topmargin="0" leftmargin="0">
<table width="540" height="252" border="0" cellpadding="0" cellspacing="0">
  <tr>
    <td height="250"><script language="JavaScript1.2">


ns4 = (document.layers)? true:false
ie4 = (document.all)? true:false
ie5 =(document.getElementById)? true:false
ns6 = (document.getElementById && !document.all)?true:false;

function over(id){
var styleObj = (ns4)? document.layers[id] : (ie4)? document.all[id].style : document.getElementById(id).style;
styleObj.visibility = "visible";
}

function ud(id){
var styleObj = (ns4)? document.layers[id] : (ie4)? document.all[id].style : document.getElementById(id).style;
styleObj.visibility = "hidden";
}


var slideshow_width='540px' //SET SLIDESHOW WIDTH (set to largest image's width if multiple dimensions exist)
var slideshow_height='250px' //SET SLIDESHOW HEIGHT (set to largest image's height if multiple dimensions exist)
var pause=5000 //SET PAUSE BETWEEN SLIDE (2000=2 seconds)

var dropimages=new Array()
//SET IMAGE PATHS. Extend or contract array as needed
dropimages[3]="images/billede_01.jpg"
dropimages[1]="images/billede_02.jpg"
dropimages[0]="images/billede_03.jpg"
dropimages[2]="images/billede_04.jpg"
dropimages[4]="images/storfilm/regel_nr_1.jpg"


var droplinks=new Array()
//SET IMAGE URLs. Extend or contract array as needed
droplinks[3]="# onMouseover='over('lag')' onMouseout='ud('lag')'"
droplinks[1]="http://195.41.82.119/cgi-bin/TableProducer.exe/EventTable?BioNo=47&FilmNo=1268"
droplinks[0]="http://195.41.82.119/cgi-bin/TableProducer.exe/EventTable?BioNo=47&FilmNo=1268"
droplinks[2]="http://195.41.82.119/cgi-bin/TableProducer.exe/EventTable?BioNo=47&FilmNo=1266"
droplinks[4]="http://195.41.82.119/cgi-bin/TableProducer.exe/EventTable?BioNo=47&FilmNo=1268"

////NO need to edit beyond here/////////////

var preloadedimages=new Array()
for (p=0;p<dropimages.length;p++){
preloadedimages[p]=new Image()
preloadedimages[p].src=dropimages[p]
}

var ie4=document.all
var dom=document.getElementById

if (ie4||dom)
document.write('<div style="position:relative;width:'+slideshow_width+';height:'+slideshow_height+';overflow:hidden"><div id="canvas0" style="position:absolute;width:'+slideshow_width+';height:'+slideshow_height+';top:-'+slideshow_height+'"></div><div id="canvas1" style="position:absolute;width:'+slideshow_width+';height:'+slideshow_height+';top:-'+slideshow_height+'"></div></div>')
else
document.write('<a href="java script:rotatelink()"><img name="defaultslide" src="'+dropimages[0]+'" border=0></a>')

var curpos=parseInt(slideshow_height)*(-1)
var degree=10
var curcanvas="canvas0"
var curimageindex=0
var nextimageindex=1


function movepic(){
if (curpos<0){
curpos=Math.min(curpos+degree,0)
tempobj.style.top=curpos+"px"
}
else{
clearInterval(dropslide)
nextcanvas=(curcanvas=="canvas0")? "canvas0" : "canvas1"
tempobj=ie4? eval("document.all."+nextcanvas) : document.getElementById(nextcanvas)
tempobj.innerHTML='<a href="'+droplinks[curimageindex]+'"><img src="'+dropimages[curimageindex]+'" border=0></a>'
nextimageindex=(nextimageindex<dropimages.length-1)? nextimageindex+1 : 0
setTimeout("rotateimage()",pause)
}
}

function rotateimage(){
if (ie4||dom){
resetit(curcanvas)
var crossobj=tempobj=ie4? eval("document.all."+curcanvas) : document.getElementById(curcanvas)
crossobj.style.zIndex++
var temp='setInterval("movepic()",50)'
dropslide=eval(temp)
curcanvas=(curcanvas=="canvas0")? "canvas1" : "canvas0"
}
else
document.images.defaultslide.src=dropimages[curimageindex]
linkindex=curimageindex
curimageindex=(curimageindex<dropimages.length-1)? curimageindex+1 : 0
}

function rotatelink(){
window.location=droplinks[linkindex]
}

function resetit(what){
curpos=parseInt(slideshow_height)*(-1)
var crossobj=ie4? eval("document.all."+what) : document.getElementById(what)
crossobj.style.top=curpos+"px"
}

function startit(){
var crossobj=ie4? eval("document.all."+curcanvas) : document.getElementById(curcanvas)
crossobj.innerHTML='<a href="'+droplinks[curimageindex]+'"><img src="'+dropimages[curimageindex]+'" border=0></a>'
rotateimage()
}

if (ie4||dom)
window.onload=startit
else
setInterval("rotateimage()",pause)

    </script>
</td>
  </tr>
  <tr>
    <td height="1" bgcolor="#919191"> </td>
  </tr>
</table>
<div id="lag" name="lag" style="position: absolute; left:50; top:350; width: 200; height:100; z-index: 3; visibility: hidden">Denne tekst vises n&aring;r der klikkes</div>
</body>
</html>
Avatar billede Ny bruger Nybegynder

Din løsning...

Tilladte BB-code-tags: [b]fed[/b] [i]kursiv[/i] [u]understreget[/u] Web- og emailadresser omdannes automatisk til links. Der sættes "nofollow" på alle links.

Loading billede Opret Preview
Kategori
Vi tilbyder markedets bedste kurser inden for webudvikling

Log ind eller opret profil

Hov!

For at kunne deltage på Computerworld Eksperten skal du være logget ind.

Det er heldigvis nemt at oprette en bruger: Det tager to minutter og du kan vælge at bruge enten e-mail, Facebook eller Google som login.

Du kan også logge ind via nedenstående tjenester