styx web site


 Drivers
 Fichiers dll
 Emoticones
Hoax 
 Freewares

Retour Actualité Liens

Effet ouverture de lien "zoom"

Placez ce script entre les balises <head></head> de votre page :

<script language="JavaScript1.2">
<!--

/* Zooming link script by Paul Anderson, copyright 2001 CNET Builder.com.
May be freely used with attribution. Not for resale. All rights reserved.
Make a link zoom open by adding the event handler

onclick="zoomBox(event,this);return false"

To zoom into a new, positioned window add width, height, left, and top

onclick="zoomBox(event,this,640,480,100,50);return false"
*/

var maxW,maxH,fromX,fromY,toX,toY,adjX,adjY,zBox,zStep=0,zLink,zNew;

function zoomBox(evt,zlink,maxw,maxh,tox,toy) {
if (arguments.length > 2) zNew=1;
scrollH=(window.pageYOffset!=null)?window.pageYOffset:document.body.scrollTop;
maxW=maxw?maxw:window.innerWidth?innerWidth:document.body.clientWidth;
maxH=maxh?maxh:window.innerHeight?innerHeight:document.body.clientHeight;
toX=tox?tox:0;
toY=(toy?toy:0)+scrollH;
fromX=evt.pageX?evt.pageX:evt.clientX;
fromY=(evt.pageY?evt.pageY:evt.clientY)+(document.all?scrollH:0);
adjX=toX+evt.screenX-fromX;
adjY=toY+evt.screenY-fromY;
if (document.createElement && document.body.appendChild && !zBox) {
zBox=document.createElement("div");
zBox.style.position="absolute";
document.body.appendChild(zBox);
} else if (document.all && !zBox) {
document.all[document.all.length-1].outerHTML+='<div id="zBoxDiv" style="position:absolute"></div>';
zBox=document.all.zBoxDiv;
} else if (document.layers && !zBox) {
zBox=new Layer(maxW);
zBox.style=zBox;
}
zLink=zlink;
doZoom();
}

function doZoom() {
zStep+=1;
zPct=(10-zStep)/10
if (document.layers) {
zBox.moveTo(toX+zPct*(fromX-toX),toY+zPct*(fromY-toY));
zBox.document.open();
zBox.document.write("<table width='"+maxW*(1-zPct)+"' height="+maxH*(1-zPct)+" border=2 cellspacing=0><tr><td></td></tr></table>");
zBox.document.close();
} else {
zBox.style.border="2px solid #999999";
zBox.style.left=toX+zPct*(fromX-toX);
zBox.style.top=toY+zPct*(fromY-toY);
zBox.style.width=maxW*(1-zPct);
zBox.style.height=maxH*(1-zPct);
}
zBox.style.visibility="visible";
if (zStep < 10) setTimeout("doZoom("+fromX+","+fromY+","+toX+","+toY+")",30);
else {
zBox.style.visibility='hidden';
zStep=0;
if (zLink && !zNew) location.href=zLink.href;
else if (zLink && zNew) {
var w=window.open(zLink.href,'','width='+maxW+',height='+maxH+',left='+adjX+',top='+adjY+',scrollbars,resizable');
zNew=null;
}
}
}

//-->
</script>

Une fois ce script en place, vous pouvez ajouter l'effet de zoom à chaque lien en attribuant le gestionnaire d'événements à la balise <a> du lien:

onclick="zoomBox(event,this);return false"

Par exemple, un lien vers news.htm deviendrait :

<a href="news.htm" onclick="zoomBox(event,this);return false">

 


Informatique
& Internet 
Sécurité/Virus 
ToolBox 
Webmaster 


Classement & statistiques
Classement de sites - Inscrivez le vtre!