Zoom PHP
|
Thread Tools | Display Modes |
|
#13
|
||||
|
||||
Après 1h de dev...
Bon voilà une solution rapide, et facilement implémentable (et modifiable).
D'abord, tu mets ça entre tes balises <head> et </head> : Code:
<script type="text/javascript"> <!-- var ndfrdivnum = 0; function ndfr_zoomsh(divid) { if (document.getElementById) { //IE5 and NS6 document.getElementById(divid).style.filter += "progid:DXImageTransform.Microsoft.alpha(enabled=1,opacity=100)"; document.getElementById(divid).style.filter += "progid:DXImageTransform.Microsoft.shadow(direction=135,color=#666666,strength=3)"; if (document.getElementById(divid).style.visibility == 'visible') { document.getElementById(divid).style.display = 'none'; document.getElementById(divid).style.visibility = 'hidden'; } else { document.getElementById(divid).style.display = ''; document.getElementById(divid).style.visibility = 'visible'; } } if ((document.all) && (!document.getElementById)) { //IE4 only document.all[divid].style.filter += "progid:DXImageTransform.Microsoft.alpha(enabled=1,opacity=100)"; document.all[divid].style.filter += "progid:DXImageTransform.Microsoft.shadow(direction=135,color=#666666,strength=3)"; if (document.all[divid].style.visibility == 'visible') { document.all[divid].style.display = 'none'; document.all[divid].style.visibility = 'hidden'; } else { document.all[divid].style.display = ''; document.all[divid].style.visibility = 'visible'; } } if (document.layers) { //NS4.X only if (document.layers[divid].visibility == 'show') { document.layers[divid].display = 'none'; document.layers[divid].visibility = 'hide'; } else { document.layers[divid].display = ''; document.layers[divid].visibility = 'show'; } } } function ndfr_zoom(tnp, tnw, tnh, imp, imw, imh, num) { document.write('<img src="' + imp + '" alt="Cliquez ici pour agrandir l\'image" name="ndfrzoomth' + num + '" width="' + tnw + '" height="' + tnh + '" border="0" id="ndfrzoomth' + num + '" onclick="java_script_:ndfr_zoomsh(\'ndfrzoomdiv' + num + '\');" style="cursor: pointer;" />'); document.write('<div id="ndfrzoomdiv' + num + '" style="display: none; left: 0px; position: relative; border: 1px solid #333333; height: ' + imh + 'px; top: 0px; visibility: hidden; width: ' + imw + 'px; z-index: 99;"><img src="' + imp + '" alt="" name="ndfrzoomimg' + num + '" width="' + imw + '" height="' + imh + '" border="0" id="ndfrzoomimg' + num + '" /></div>'); } //--> Code:
<script type="text/javascript"> <!-- ndfrdivnum ++; ndfr_zoom('cheminv', largeurv, hauteurv, 'chemini', largeuri, hauteuri, ndfrdivnum); //--> </script> Ce code permet d'écrire une vignette, ainsi qu'un DIV contenant l'image en taille réelle. La fonction ndfr_zoom prend en paramètres, et dans cet ordre, le chemin vers la vignette, sa largeur, sa hauteur, le chemin vers l'image, sa largeur et sa hauteur. Le paramètre ndfrdivnum est passé automatiquement, et permet d'avoir plusieurs images "zoomables" sur une même page, sans conflit d'ID. Modifications réalisables : On peut parfaitement imaginer ne passer que le chemin de l'image, sa largeur et sa hauteur (ces paramètres sont obligatoires, sans quoi le DIV va foirer), puis utiliser l'image pour la vignette, en lui imposant une largeur et en ne donnant pas de hauteur (ou vice-versa). On peut aussi placer le DIV ailleurs, ou le rendre flottant (actuellement, il s'insère sous l'image, en déplacant le reste du contenu de la page). On peut aussi retirer les filtres spéciaux IE que j'ai mis (ombrage et opacité). |
Bookmarks |
«
Previous Thread
|
Next Thread
»
Currently Active Users Viewing This Thread: 1 (0 members and 1 guests) | |
Thread Tools | |
Display Modes | |
|
|
![]() |
||||
Thread | Thread Starter | Forum | Replies | Last Post |
PHP 4.3.10 et PHP 5.0.3 | 1for-matik | Actualité | 0 | 16-12-2004 18:40 |
Zoom Player 4.02 Final | Steven | Vos news | 1 | 19-08-2004 18:40 |
PHP 5.0.0 Final | Toitoine | Actualité | 10 | 18-07-2004 17:16 |
Zoom Player (Beta) 4.00 RC3 | Toitoine | Actualité | 1 | 09-06-2004 12:13 |
creer un site en php | kenny250 | Discussions sur le site et/ou le forum | 5 | 03-11-2002 11:40 |
All times are GMT +2. The time now is 05:52.
Powered by vBulletin® Version 3.8.4
Copyright ©2000 - 2025, Jelsoft Enterprises Ltd.
Copyright ©2000 - 2025, Jelsoft Enterprises Ltd.