HTML foto

Status
Niet open voor verdere reacties.
Gelukkig is de broncode zo gevonden ;)

HTML:
<html>

<head>
<META HTTP-EQUIV="imagetoolbar" CONTENT="no">
<body oncontextmenu="return false" background="paardwallpaper1.jpg" style="background-attachment: fixed"> 
<body ondragstart="return false" background="paardwallpaper1.jpg" style="background-attachment: fixed"> 
<body onselectstart="return false" background="paardwallpaper1.jpg" style="background-attachment: fixed">
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
<title>Nieuwe pagina 3</title>
<base target="_self">
</head>

<body link="#C0C0C0" vlink="#C0C0C0" alink="#C0C0C0" text="#C0C0C0" background="paardwallpaper1.jpg" style="background-attachment: fixed">

<p align="left" style="margin-bottom: -20px">
<img border="0" src="banners/banner1.gif" width="673" height="73"></p>
<p align="left" style="margin-bottom: -20px">
<td width="26%"><script language="JavaScript1.2">
//Instellen van het veld:
var breedte=800
var hoogte=400
var snelheid=2
agrondkleur="#FFFFFF"
//Invoegen van de afbeeldingen met eventuele hyperlinks:
var afbeelding=new Array()
afbeelding[0]='<img src="home foto/foto1.jpg" width=267 height=400 border=0></a>'
afbeelding[1]='<img src="home foto/foto2.jpg" width=267 height=400 border=0></a>'
afbeelding[2]='<img src="home foto/foto3.jpg" width=267 height=400 border=0></a>'
afbeelding[3]='<img src="home foto/foto19.jpg" width=291 height=400 border=0></a>'
afbeelding[4]='<img src="home foto/foto4.jpg" width=267 height=400 border=0></a>'
afbeelding[5]='<img src="home foto/foto9.jpg" width=267 height=400 border=0></a>'
afbeelding[6]='<img src="home foto/foto6.jpg" width=600 height=400 border=0></a>'
afbeelding[7]='<img src="home foto/foto7.jpg" width=267 height=400 border=0></a>'
afbeelding[8]='<img src="home foto/foto8.jpg" width=267 height=400 border=0></a>'
afbeelding[9]='<img src="home foto/foto5.jpg" width=267 height=400 border=0></a>'
afbeelding[10]='<img src="home foto/foto10.jpg" width=267 height=400 border=0></a>'
afbeelding[11]='<img src="home foto/foto11.jpg" width=267 height=400 border=0></a>'
afbeelding[12]='<img src="home foto/foto12.jpg" width=267 height=400 border=0></a>'

//Hieronder niets wijzigen
var kopieersnelheid=snelheid
afbeelding='<nobr>'+afbeelding.join(" ")+'</nobr>'
var iedom=document.all||document.getElementById
if (iedom)
document.write('<span id="temp" style="visibility:hidden;position:absolute;top:-100;left:-3000">'+afbeelding+'</span>')
var huidige_breedte=''
function opvullen(){
if (iedom){
afb=document.getElementById? document.getElementById("test2") : document.all.test2
afb2=document.getElementById? document.getElementById("test3") : document.all.test3
afb.innerHTML=afb2.innerHTML=afbeelding
huidige_breedte=document.all? afb.offsetWidth : document.getElementById("temp").offsetWidth
afb2.style.left=huidige_breedte+4
}
else if (document.layers){
ns_slide=document.netscape.document.netscape2
ns_slide2=document.netscape.document.netscape3
ns_slide.document.write(afbeelding)
ns_slide.document.close()
huidige_breedte=ns_slide.document.width
ns_slide2.left=huidige_breedte+4
ns_slide2.document.write(afbeelding)
ns_slide2.document.close()}
lefttime=setInterval("schuiflinks()",30)}
window.onload=opvullen
function schuiflinks(){
if (iedom){
if (parseInt(afb.style.left)>(huidige_breedte*(-1)+8))
afb.style.left=parseInt(afb.style.left)-kopieersnelheid
else
afb.style.left=parseInt(afb2.style.left)+huidige_breedte+4

if (parseInt(afb2.style.left)>(huidige_breedte*(-1)+8))
afb2.style.left=parseInt(afb2.style.left)-kopieersnelheid
else
afb2.style.left=parseInt(afb.style.left)+huidige_breedte+4

}
else if (document.layers){
if (ns_slide.left>(huidige_breedte*(-1)+8))
ns_slide.left-=kopieersnelheid
else
ns_slide.left=ns_slide2.left+huidige_breedte+4

if (ns_slide2.left>(huidige_breedte*(-1)+8))
ns_slide2.left-=kopieersnelheid
else
ns_slide2.left=ns_slide.left+huidige_breedte+4
}
}

if (iedom||document.layers){
with (document){
document.write('<table border="0" cellspacing="0" cellpadding="0"><td>')
if (iedom){
write('<div style="position:relative;width:'+breedte+';height:'+hoogte+';overflow:hidden">')
write('')
write('<div id="test2" style="position:absolute;left:0;top:0"></div>')
write('<div id="test3" style="position:absolute;left:0;top:0"></div>')
write('</div></div>')
}
else if (document.layers){
write('')
write('')
write('')
write('')
}
document.write('</td></table>')
}
}
</script>&nbsp;</script></td></p>

<body><STYLE type="text/css">
    BODY {scrollbar-3dlight-color:#5B5B5B;
           scrollbar-arrow-color:#5B5B5B;
           scrollbar-base-color:#CDCDC1;
           scrollbar-track-color:#5B5B5B;
           scrollbar-darkshadow-color:#5B5B5B;
           scrollbar-face-color:#C1C1C1;
           scrollbar-highlight-color:#FFFFFF;
           scrollbar-shadow-color:#5B5B5B}
  </STYLE>
<p align="left"><font size="1" color="#FFFFFF">Let op: Alle foto's vallen 
onder copyright van Fotodesignstudio en mogen niet zonder akkoord van 
de fotograaf worden verveelvoudigd of gepubliceerd. </font></p>
</body>

</html>
Niet de netste code maar je moet er genoeg uit kunnen halen.
Kwestie van wat zaken aanpassen en verbeteren :)

De scrollbar-* stijl-elementen werken alleen in IE dus kun je net zo goed verwijderen.
 
Niet de netste code
Dat is wel heel bescheiden opgemerkt. ;)
Ik ben nog steeds hogelijk verbaasd dat o.a. met 5 (vijf) <body> tags, waarvan 3 (drie) binnen de <head> mijn beeldscherm meer dan wit laat zien. :shocked:

Maar terzake: met deze door javascript aangedreven foto-wisselaar ben je als site-bezoeker niet in staat om de beweging te stoppen als je een foto wilt stilzetten om 'm beter te bekijken. Dat zou wellicht aan het script kunnen worden toegevoegd.

Een (scriptloos) alternatief kan een fotostrook zijn, die je met een horizontale schuifbalk zelf kan bedienen. Een voorbeeld daarvan staat hier, met ook een verder in stijl uitgewerkte vervolgpagina.

Met vriendelijke groet,
CSShunter
 
Status
Niet open voor verdere reacties.
Terug
Bovenaan Onderaan