Code:
<HTML>
<HEAD>
<script type="text/javascript" src="js/prototype.js"></script>
<script type="text/javascript" src="js/scriptaculous.js?load=effects"></script>
<script type="text/javascript" src="js/lightbox.js"></script>
<link rel="stylesheet" href="css/lightbox.css" type="text/css" media="screen" />
<style type="text/css">
#overlay {
display: block!important;
opacity: 0.8!important;
filter: alpha(opacity=80)!important;
}
#bottomNavClose {
visibility: hidden;
}
</style>
<script type="text/javascript">
function isLb(){
if(typeof myLightbox == 'undefined'){
setTimeout(isLb, 300);
return;
}
for(var lb = [], i = 0; i < document.links.length; ++i)
if(/^lightbox/.test(document.links[i].rel))
lb[lb.length]=document.links[i];
isLb.num = isLb.num > lb.length - 1? 0 : isLb.num;
if(myLightbox.start(lb[isLb.num]))
myLightbox.start(lb[isLb.num]).apply(lb[isLb.num]);
++isLb.num
setTimeout(isLb, 5000);
};
isLb.num = 0;
window.onload=isLb;
</script>
</HEAD>
<TITLE>Testing page</TITLE>
<BODY>
<a href="images/aardappelruw.jpg" rel="lightbox" title="pommes de terre"><img src="images/aardappelruw.jpg" height="50" width="50"></a>
<a href="images/aardappelschijfjes.jpg" rel="lightbox" title="un pom naturel"><img src="images/aardappelschijfjes.jpg" height="50" width="50"></a>
<a href="images/aardappelpartjes.jpg" rel="lightbox" title="deux pom naturel"><img src="images/aardappelpartjes.jpg" height="50" width="50"></a>
<BR><BR>
Click one of the images!
</BODY>
</HTML>
Bookmarks