java javascript     . Foto pop-up 2

Omschrijving   Voorbeeld

Allereerst download je de benodigde spullen die je hier voor nodig hebt.

Dit zijn de java's en de achtergrond en die krijg je door HIER te klikken.

Verander de
<body>
in
<body onLoad="Tooltip.init()">

     
     

In de css

div#tipDiv {
position:absolute; visibility:hidden; left:0; top:0; z-index:10000;
background-image: url(overlay.png); border:2px solid #000000;
width:600px; padding:0px;
color:#000000; font-size:13px; color:#f5f5f0; line-height:1.3;
}
div#tipDiv div.img {
text-align:center }
div#tipDiv div.txt {
text-align:center;
margin-top:2px; margin-bottom:2px;; margin-left:5px;
FONT-FAMILY: Arial, Helvetica, sans-serif;
FONT-SIZE:13px;
COLOR: #f5f5f0;
FONT-WEIGHT: normal;
font-style: normal;}

In de head

<script src="dw_event.js" type="text/javascript"></script>
<script src="dw_viewport.js" type="text/javascript"></script>
<script src="dw_tooltip.js" type="text/javascript"></script>
<script type="text/javascript">
function doTooltip(e, ar) {
if ( typeof Tooltip == "undefined" || !Tooltip.ready ) return;
var cntnt = wrapTipContent(ar);
var tip = document.getElementById( Tooltip.tipID );
Tooltip.show(e, cntnt);
}
function hideTip() {
if ( typeof Tooltip == "undefined" || !Tooltip.ready ) return;
Tooltip.hide();
}
function wrapTipContent(ar) {
var cntnt = "";
if ( ar[0] ) cntnt += '<div class="img"><img src="' + ar[0] + '"></div>';
if ( ar[1] ) cntnt += '<div class="txt">' + ar[1] + '</div>';
return cntnt;
}
var messages = new Array();
messages[0] = ['joufoto','<div>tekst</div>'];
var imageHandler = {
path:"images/",
imgs:[], preload:function() { for(var i=0;arguments[i];i++) {
var img=new Image(); img.src=this.path+arguments[i]; this.imgs[this.imgs.length]=img;}}
}
imageHandler.preload(".jpg");
</script>

Tussen de bodytags

<a href="#" onMouseOver="doTooltip(event, messages[0] )" onMouseOut="hideTip()">
<img src="foto.jpg" width="1000" height="105" border="0" align="0"></a>

end
terug
terug