Hallo Mensen,
Ik ben bezig met een webpagina (ben beginner) en wil hierin graag een fade plaatje pas na na bijv 3 seconden na inladen van pagina laten beginnen? wat moet ik dan aanpassen in de onderstaande code?
Voorbaat dank!!
arno
Ik ben bezig met een webpagina (ben beginner) en wil hierin graag een fade plaatje pas na na bijv 3 seconden na inladen van pagina laten beginnen? wat moet ik dan aanpassen in de onderstaande code?
Voorbaat dank!!
arno
Code:
<!doctype html public '-//w3c//dtd html 4.01 transitional//en'>
<HTML>
<HEAD>
<TITLE>photo-fade</TITLE>
<META NAME="Title" CONTENT="dfs">
<META NAME="Author" CONTENT="asdfdsft">
<META NAME="Subject" CONTENT="sdfsdf">
<META NAME="Description" CONTENT="sdfdf">
<meta http-equiv="imagetoolbar" content="no">
<META NAME="Keywords" CONTENT="edfe">
<META NAME="Language" CONTENT="NL">
<META NAME="Robots" CONTENT="All">
<!-- ***
--><style type="text/css">
body {background-image: url(achtergrond3.gif); background-repeat: repeat;}
p {font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 10pt;}
a:hover {color: #eec00b; text-decoration:none;}
ul {list-style-type: circle; font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 10pt}
#photoholder {
width:985px;
height:764px;
align:center;
border:0px solid #666;
background:#fff url('loading.jpg') 50% 50% no-repeat;
}
#thephoto {
width:985px;
height:764px;
}
</style>
<script type="text/javascript">
<!--
document.write("<style type='text/css'>#thephoto {visibility:hidden;}</style>");
function initImage() {
imageId = 'thephoto';
image = document.getElementById(imageId);
setOpacity(image, 0);
image.style.visibility = "visible";
fadeIn(imageId, 0);
}
function fadeIn(objId,opacity) {
if (document.getElementById) {
obj = document.getElementById(objId);
if (opacity <= 100) {
setOpacity(obj, opacity);
opacity += 5;
setTimeout("fadeIn('"+objId+"',"+opacity+")", 100)
}
}
}
function setOpacity(obj, opacity) {
opacity = (opacity == 100)?99.999:opacity;
// IE/Win
obj.style.filter = "alpha(opacity:"+opacity+")";
// Safari<1.2, Konqueror
obj.style.KHTMLOpacity = opacity/100;
// Older Mozilla and Firefox
obj.style.MozOpacity = opacity/100;
// Safari 1.2, newer Firefox and Mozilla, CSS3
obj.style.opacity = opacity/100;
}
window.onload = function() {initImage()}
//-->
</script>
</head>
<body leftmargin="2" marginwidth="2" topmargin="2" marginheight="2">
<center>
<p> </p>
<p id="photoholder" align="center">
<a href="home.htm" target="_self"><img src="plaatje.bmp" />
</a></p>
</center>
</BODY>
</HTML>
Laatst bewerkt:
