begin process at 2012 05 28 11:12:48
  Trouver un code source :
 
dans
 
Accueil > 

Code

 > 

Graphique

 > LOUPE ET ZOOM

LOUPE ET ZOOM


 Information sur la source

Note :
9,67 / 10 - par 3 personnes
9,67 / 10

  • 1

  • 2

  • 3

  • 4

  • 5

  • 6

  • 7

  • 8

  • 9

  • 10
Catégorie :Graphique Classé sous :loupe, zoom, loupe zoom, zoom loupe Niveau :Débutant Date de création :01/03/2011 Date de mise à jour :12/03/2011 11:33:53 Vu / téléchargé :3 798 / 374

Auteur : kazma

Ecrire un message privé
Commentaire sur cette source (17)
Ajouter un commentaire et/ou une note

 Description

Cliquez pour voir la capture en taille normale
c'est une loupe avec la possibilite d'augmenter le niveau d'agrandissement en jouant de la molette

j'ai mis deux sources une ou il suffit de passer sur une image quelconque et une autre avec une zone pour l'image qui subit la loupe pour cette derniere je lui ai rajouter une variante avec prechargement

Source

  • var kloupe={
  • mooz:1,
  • facteur:0,
  • taille:0,
  • element:null,
  • zoom:function(e){
  • if(kloupe.taille == 0){
  • kloupe.taille=document.getElementById('igmg').offsetHeight;
  • }
  • var delta = 0;
  • delta =((e.wheelDelta) ? e.wheelDelta/120 : -e.detail/3);
  • if(kloupe.taille+(kloupe.taille*(kloupe.mooz+delta))>document.getElementById('igmg').parentNode.offsetHeight){
  • kloupe.mooz+=((delta<0) ? -0.1 : 0.1);
  • document.getElementById('igmg').style.height=kloupe.taille*kloupe.mooz+'px';
  • kloupe.loupe(e);
  • }
  • else{
  • document.getElementById('igmg').style.height=document.getElementById('igmg').parentNode.offsetHeight+'px';
  • kloupe.loupe(e);
  • }
  • },
  • loupe:function(evt){
  • evt=evt ? evt : event
  • var grande_image=document.getElementById('igmg');
  • var igmp=kloupe.element;
  • var clic=grande_image.parentNode;
  • var dde=(navigator.vendor) ? document.body : document.documentElement;
  • if(kloupe.facteur == 0){
  • kloupe.facteur=grande_image.offsetHeight/igmp.offsetHeight;
  • }
  • var setX =evt.clientX + dde.scrollLeft;
  • var setY =evt.clientY + dde.scrollTop;
  • grande_image.style.left=-((setX-igmp.offsetLeft)*kloupe.facteur*kloupe.mooz)+(clic.offsetWidth/2)+'px';
  • grande_image.style.top=-((setY-igmp.offsetTop)*kloupe.facteur*kloupe.mooz)+(clic.offsetHeight/2)+'px';
  • },
  • dp:function(){
  • var grand=document.getElementById('igmg').parentNode;
  • var adj=kloupe.element;
  • if(grand.style.display && grand.style.display=="block"){
  • grand.style.display="none";
  • }
  • else{
  • grand.style.display="block";
  • var dde=document.documentElement;
  • var ddn=(navigator.vendor) ? document.body : document.documentElement;
  • if(adj.offsetLeft+grand.offsetWidth+adj.offsetWidth+20>dde.clientWidth+ddn.scrollLeft){
  • grand.style.left=adj.offsetLeft-grand.offsetWidth-20+'px';
  • }
  • else{
  • grand.style.left=adj.offsetLeft + adj.offsetWidth+20+'px';
  • }
  • if(adj.offsetTop+grand.offsetHeight>dde.clientHeight+ddn.scrollTop){
  • grand.style.top=adj.offsetTop - grand.offsetHeight + adj.offsetHeight-20+'px';
  • }
  • else{
  • grand.style.top=adj.offsetTop-10+'px';
  • }
  • }
  • },
  • raz:function(lui){
  • if(kloupe.element!=null){
  • if(navigator.appName.substring(0,5)=="Micro"){
  • kloupe.element.detachEvent('onmousewheel', kloupe.zoom);
  • kloupe.element.detachEvent('onmousewheel', kloupe.selecte);
  • kloupe.element.detachEvent('onmousemove', kloupe.loupe);
  • kloupe.element.detachEvent('onmouseout', kloupe.dp);
  • }
  • else{
  • kloupe.element.removeEventListener("mousemove", kloupe.loupe, false);
  • kloupe.element.removeEventListener("mouseout", kloupe.dp, false);
  • var elmouse=((navigator.userAgent.indexOf("Firefox") != -1) ? 'DOMMouseScroll' : 'mousewheel');
  • kloupe.element.removeEventListener(elmouse, kloupe.zoom, false);
  • kloupe.element.removeEventListener(elmouse, kloupe.selecte, false);
  • }
  • }
  • kloupe.element=lui;
  • var adi=document.getElementById('igmg');
  • adi.src=lui.src
  • kloupe.facteur = 0;
  • kloupe.taille=0;
  • kloupe.mooz=1;
  • adi.style.height=lui.offsetHeight*4+'px';
  • if(navigator.appName.substring(0,5)=="Micro"){
  • lui.attachEvent('onmousewheel', kloupe.zoom);
  • lui.attachEvent('onmousewheel', kloupe.selecte);
  • lui.attachEvent('onmousemove', kloupe.loupe);
  • lui.attachEvent('onmouseout', kloupe.dp);
  • }
  • else{
  • lui.addEventListener("mousemove", kloupe.loupe, false);
  • lui.addEventListener("mouseout", kloupe.dp, false);
  • var elmouse=((navigator.userAgent.indexOf("Firefox") != -1) ? 'DOMMouseScroll' : 'mousewheel');
  • lui.addEventListener(elmouse, kloupe.zoom, false);
  • lui.addEventListener(elmouse, kloupe.selecte, false);
  • }
  • kloupe.dp();
  • },
  • selecte:function (ev){
  • (navigator.appName.substring(0,3)=="Mic") ? event.returnValue = false : ev.preventDefault();
  • }
  • }
var kloupe={

mooz:1,
facteur:0,
taille:0,
element:null,

zoom:function(e){

if(kloupe.taille == 0){
kloupe.taille=document.getElementById('igmg').offsetHeight;
}
var delta = 0;
delta =((e.wheelDelta) ? e.wheelDelta/120 : -e.detail/3);

if(kloupe.taille+(kloupe.taille*(kloupe.mooz+delta))>document.getElementById('igmg').parentNode.offsetHeight){

kloupe.mooz+=((delta<0) ? -0.1 : 0.1);
document.getElementById('igmg').style.height=kloupe.taille*kloupe.mooz+'px';
kloupe.loupe(e);
}
else{
document.getElementById('igmg').style.height=document.getElementById('igmg').parentNode.offsetHeight+'px';
kloupe.loupe(e);
}
},

loupe:function(evt){

evt=evt ? evt : event

var grande_image=document.getElementById('igmg');
var igmp=kloupe.element;
var clic=grande_image.parentNode;
var dde=(navigator.vendor) ? document.body : document.documentElement;

if(kloupe.facteur == 0){
kloupe.facteur=grande_image.offsetHeight/igmp.offsetHeight;
}
var setX =evt.clientX + dde.scrollLeft;
var setY =evt.clientY + dde.scrollTop;
grande_image.style.left=-((setX-igmp.offsetLeft)*kloupe.facteur*kloupe.mooz)+(clic.offsetWidth/2)+'px';
grande_image.style.top=-((setY-igmp.offsetTop)*kloupe.facteur*kloupe.mooz)+(clic.offsetHeight/2)+'px';
},

dp:function(){

var grand=document.getElementById('igmg').parentNode;
var adj=kloupe.element;

if(grand.style.display && grand.style.display=="block"){
grand.style.display="none";
}
else{
grand.style.display="block";

var dde=document.documentElement;
var ddn=(navigator.vendor) ? document.body : document.documentElement;

if(adj.offsetLeft+grand.offsetWidth+adj.offsetWidth+20>dde.clientWidth+ddn.scrollLeft){
grand.style.left=adj.offsetLeft-grand.offsetWidth-20+'px';
}
else{ 
grand.style.left=adj.offsetLeft + adj.offsetWidth+20+'px';
}

if(adj.offsetTop+grand.offsetHeight>dde.clientHeight+ddn.scrollTop){
grand.style.top=adj.offsetTop - grand.offsetHeight + adj.offsetHeight-20+'px';
}
else{
grand.style.top=adj.offsetTop-10+'px';
}
}
},


raz:function(lui){

if(kloupe.element!=null){

if(navigator.appName.substring(0,5)=="Micro"){
kloupe.element.detachEvent('onmousewheel', kloupe.zoom);
kloupe.element.detachEvent('onmousewheel', kloupe.selecte);
kloupe.element.detachEvent('onmousemove', kloupe.loupe);
kloupe.element.detachEvent('onmouseout', kloupe.dp);
}
else{
kloupe.element.removeEventListener("mousemove", kloupe.loupe, false);
kloupe.element.removeEventListener("mouseout", kloupe.dp, false);

var elmouse=((navigator.userAgent.indexOf("Firefox") != -1) ? 'DOMMouseScroll' : 'mousewheel');
kloupe.element.removeEventListener(elmouse, kloupe.zoom, false);
kloupe.element.removeEventListener(elmouse, kloupe.selecte, false);
}
}

kloupe.element=lui;

var adi=document.getElementById('igmg');
adi.src=lui.src
kloupe.facteur = 0;
kloupe.taille=0;
kloupe.mooz=1;
adi.style.height=lui.offsetHeight*4+'px';


if(navigator.appName.substring(0,5)=="Micro"){
lui.attachEvent('onmousewheel', kloupe.zoom);
lui.attachEvent('onmousewheel', kloupe.selecte);
lui.attachEvent('onmousemove', kloupe.loupe);
lui.attachEvent('onmouseout', kloupe.dp);
}
else{

lui.addEventListener("mousemove", kloupe.loupe, false);
lui.addEventListener("mouseout", kloupe.dp, false);

var elmouse=((navigator.userAgent.indexOf("Firefox") != -1) ? 'DOMMouseScroll' : 'mousewheel');
lui.addEventListener(elmouse, kloupe.zoom, false);
lui.addEventListener(elmouse, kloupe.selecte, false);
}
kloupe.dp();
},

selecte:function (ev){
(navigator.appName.substring(0,3)=="Mic") ? event.returnValue = false : ev.preventDefault();
}

}

 Conclusion

diiiiinnnng daaaannnng doooonnnng

 Fichier Zip

Les Membres Club peuvent télécharger directement un fichier contenu dans le zip sans télécharger le zip en entier !

Télécharger le zip


 Historique

02 mars 2011 21:48:28 :
ajout de commentaires
05 mars 2011 18:15:15 :
ajout d'une source
12 mars 2011 11:33:57 :
debogage

 Sources du même auteur

Source avec Zip Source avec une capture BOUTON ROTATIF
Source avec Zip Source avec une capture EFFET DE ROTATION A 360° D'IMAGE AVEC ACCELERATION DECELERAT...
Source avec Zip Source avec une capture PETIT LOGICIEL DE DESSIN, RETOUCHE AVEC CANVAS
Source avec Zip Source avec une capture DRAG & DROP VERS UN CANVAS
Source avec Zip Source avec une capture DIAPO EN CSS 3D

 Sources de la même categorie

Source avec Zip JDMATH-MINI.JS : GÉNÉRATION D'EXPRESSION MATHÉMATIQUE par jdmcreator
Source avec une capture SPHERE 3D DÉFORMABLE par phm
Source avec Zip Source avec une capture EFFET DE ROTATION A 360° D'IMAGE AVEC ACCELERATION DECELERAT... par kazma
Source avec Zip Source avec une capture PETIT LOGICIEL DE DESSIN, RETOUCHE AVEC CANVAS par kazma
Source avec Zip Source avec une capture CALCULATRICE HEURE par m22001111

 Sources en rapport avec celle ci

Source avec Zip Source avec une capture CENTRAGE D'IMAGE AVEC PETIT EFFET par kazma
Source avec Zip Source avec une capture [ZI] ZOOM (LOUPE) SUR IMAGE par Bul3
Source avec Zip Source avec une capture AFFICHAGE D'IMAGE par kazma
Source avec Zip Source avec une capture ZOOM ZOOM ZOOM par kazma
Source avec Zip Source avec une capture LOUPE SUR IMAGE AU PASSAGE DE LA SOURIS ! par adelami

Commentaires et avis

Commentaire de JJDai le 02/03/2011 18:58:06

JJDAI
Dommage qu'il n'y ai pas de commentaire
JJDAI

Commentaire de kazma le 02/03/2011 21:53:16 administrateur CS

j'ai ajouter des commentaire sur une des sources (louzoom_2.js) dalleur je me demande si j'ai pas un peut abuser

bonne lecture

Commentaire de JJDai le 03/03/2011 19:56:59 10/10

Bonjour
------------------
Merci pour les commentaire.

J'aurais une petite question :
Serait -il possible plutôt que de faire le zoom a cote de le faire réellement dans une loupe qui survolerait l'image ?

Sinon excellent ça devrait me servir.

JJDAI


JJDAI

Commentaire de kazma le 05/03/2011 18:20:39 administrateur CS

retelecharge le zip j'y ai ajouter une source qui correspond a ce que tu cherchais mais  ne fonctionne pas parfaite avec IE6 et malgre mes efforts j'ai pas reussi a le faire bien fonctionner avec ie6

Commentaire de JJDai le 06/03/2011 10:22:53

Bonjour et Merci Kazma Génial c'est exactement ça.
Sur IE il y a effectivement quelques soucis, mais je vais regarder ça de mon côté.
JJDAI

Commentaire de Hulko le 12/03/2011 09:14:32 9/10

Bonjour a tous,
Merci Kazma, j`ai essaye ton code, il marche très bien, je vais même l`intégrer a mon site en construction....
Cependant, j`ai un petit souci, lorsque je l`intègre sur la page du site, il fonctionne, mais lorsque j`utilise la molette pour l`effet de zoom avant ou arrière, j`ai ma page, en même temps qui monte ou qui descend,donc c`est plutôt gênant, est-il possible, lorsque ma souri est sur une photo pour zoomer, d`interdire la monté ou la descente de la page....
Je suis novice, si quelqu'un se donne la peine de répondre ou de donner une solution,je suis preneur mais avec des explications simples et bien décrites....
Je vous remercie par avance.
Désolé, j`ai un clavier "qwerty", je vis a Bali...
MJJ  

Commentaire de kazma le 12/03/2011 11:35:28 administrateur CS

j'avait fait quelques oublies au niveau code j'ai modifier la chose et normalement sa devrait etre bon

Commentaire de Hulko le 12/03/2011 12:11:00

Bonjour Kazma,
Merci pour la rapidité de ta réponse....
Je télécharge le zip de nouveau....
Merci

Commentaire de Hulko le 12/03/2011 12:35:30

Re-bonjour,

Je ne sais pas comment éditer mon "post", alors je remet un commentaire...
Merci beaucoup Kazma, ca fonctionne nickel, t`es un chef...
++ JJM

Commentaire de lecurieux41 le 16/04/2011 13:49:28 10/10

Excellent !
Tres bon travail, continue comme cela.

Commentaire de usualbaalrog le 10/05/2011 09:05:38

Bonjour et merci pour ce code très pratique ! Néanmoins j'ai quelques soucis quant à l'ajout de cette loupezoom dans mon programme :( en fait je souhaiterais l'ajouter dans un sous sous menu de photos mais la case de zoom est complétement décalée et n'affiche rien. Si j'ajoute ce zoom sur la page principal hors du menu sur une photo quelconque par contre aucun soucis. Quelqu'un pourrait m'aiguiller ? dites moi pour le code je vous l'envoi en privé :)

Commentaire de kazma le 10/05/2011 14:13:38 administrateur CS

c'est parce que un des elements conteneur doit etre en position absolute et il est imperatif que tous les elements conteneurs soient en position statique si je me trompe pas sa doit aussi etre bon en relative sinon il faut prendre en compte la position du ou des elements qui sont en absolute

Commentaire de usualbaalrog le 11/05/2011 15:08:55

Merci d'avoir répondu mais je débute, et le conteneur ? tu parles du menu et ses sous menus ? mon menu est ni en position absolute ou en position relative j'ai laissé le paramètre par défaut car le site ce décalais complétement si je mettais position absolute sur le sous sous menu. Sinon comment prendre en compte la pos du ou des éléments qui sont en absolute ? Dans le fichier js ?

Commentaire de kazma le 12/05/2011 15:57:14 administrateur CS

il peut y avoir aussi les bordures quoi qu'il en soit dans la fonction loupe il y a ces deux lignes

grande_image.style.left=-((setX-igmp.offsetLeft)*kloupe.facteur*kloupe.mooz)+(clic.offsetWidth/2)+'px';
grande_image.style.top=-((setY-igmp.offsetTop)*kloupe.facteur*kloupe.mooz)+(clic.offsetHeight/2)+'px';

on peut modifier le decalage si par exemple je fait un decalage de 10 pixel vers la droite et le bas ca donne sa

grande_image.style.left=-((setX-igmp.offsetLeft+10)*kloupe.facteur*kloupe.mooz)+(clic.offsetWidth/2)+'px';
grande_image.style.top=-((setY-igmp.offsetTop+10)*kloupe.facteur*kloupe.mooz)+(clic.offsetHeight/2)+'px';


Commentaire de ScriWeb le 16/06/2011 16:20:08

Bonjour,

Merci pour ce script excellent qui correspond exactement à ce que je cherchais.
Je l'ai testé sur un site en construction.
J'ai un problème avec une photo en mode paysage. La loupe ne prend qu'une partie de l'image. je vais essayer d'être claire dans mon explication : je mets mon curseur sur la droite de mon image et la fenêtre de zoom reste blanche. Si je décale mon curseur vers la gauche, je commence à voir apparaitre mon image lorsque le curseur atteint à peu près la moitié. Par contre le zoom qui apparait correspond à la bordure de droite de mon image. C'est décalé quoi.
Je ne connais pas le javascript alors je n'ai pas trouvé où je pouvais modifier quelque chose pour qu'ils puisse aller au delà de 100px de largeur si j'ai bien compris, le pb doit se trouver là...
voici ma page de test : http://www.recherches-ancetres.com/prestations-tarifs2.php

Merci beaucoup.
Véronique.

Commentaire de hic8716 le 27/07/2011 16:36:03

Bonjour tout le monde,
J'ai fait une petite page permettant de réaliser un un thumbnail d'images, et j'aimerais bien intégrer ce code pour permettre de zoomer sur les vignettes d'images mais je n'arrive pas. Si quelqu'un à une idée elle sera la bienvenue, voici le code source de ma page :



<html>
<head>
<title>HTML5:Palette d'images </title>

<STYLE TYPE="text/css">
<!--
TD{font-family: Arial, Helvetica, sans-serif; font-size: 8pt;}
--->
</STYLE>

<style type="text/css">
<!--


.bandehaute {
    //fond de la bande
background-color: #7B7B7B; //couleur grise
background-position: 0px -545px;
//sépare le contenu d'un élément de sa bordure gauche.
padding-left: 10px;
font-weight: bold;
border-top-width: 0px;
border-right-width: 0px;
border-bottom-width: 1px;
border-left-width: 0px;
border-top-style: none;
border-right-style: none;
border-bottom-style: solid;
border-left-style: none;
//la couleur de la bordure
border-top-color: #B06C27;
border-bottom-color: #B06C27;
//la taille du titre
font-size: 12px;
}
.remplissage {
margin: 0px;
padding-top: 0px;
padding-right: 10px;
padding-bottom: 0px;
padding-left: 10px;
border-top-width: 0px;
border-right-width: 0px;
border-bottom-width: 0px;
border-left-width: 0px;
border-top-style: none;
border-right-style: none;
border-bottom-style: none;
border-left-style: none;
font-family: Arial, Helvetica, sans-serif;
font-size: 12px;
}

.bordure {
border: 1px solid #cccccc;
}



.images { //choisir les dimensions des vignettes
        height:150px;  
        width:150px;
        border:0px;
        margin:15px 15px 0 0;

}
-->
</style>

<style type="text/css">

table, td
{
    border-color: #7B7B7B;
    border-style: solid;
}
</style>
  
<script>
//la fonction permettant de selectionner les images
function SelectionImage(mesFichiers) {
  for (var i = 0, f; f = mesFichiers[i]; i++) {
    var imageReader = new FileReader();
    imageReader.onload = (function(fichier) {
      return function(e) {
        var span = document.createElement('span');
        span.innerHTML = ['<img class="images" src="', e.target.result,'" title="', fichier.name, '"/>'].join('');
        document.getElementById('thumbs').insertBefore(span, null);
      };
    })(f);
    imageReader.readAsDataURL(f);
  }
}
//fonction qui permet de déposer les images
function deposer(e) {  
   SelectionImage(e.dataTransfer.files);
   e.stopPropagation();  
   e.preventDefault();  
}  


</script>

</head>

<body>



<center>
<!-- width largeur de la bande, largeur du bord
- cellpadding : Spécifie l'espace en pixels entre la bordure et le contenu de la cellule du tableau
- cellspacing : Spécifie l'espace en pixels entre les cellules du tableau -->
<table width="700" border="10" cellspacing=1 cellpadding=5>
<tr bgcolor="#5D292D">
<!-- placement du titre a gauche -->
<td class="bandehaute" align="left">
<p>Palette miniatures d'images</p>
</td>
</tr>
<tr>
<!-- //aligner les images du gauche à droite -->
<td align="left" height="105" ondragenter="return false" ondragover="return false" ondrop="deposer(event)"> <output id="thumbs"></output>
</td>
</tr>
<tr>
<td align="center">
<!-- //bouton parcourir avec choix multiple -->
<p> Glisser-déposer ou choisir des images : <input type="file" id="input" size="10" multiple="true" onchange="SelectionImage(this.files)" /></p>
</td>
</tr>
</table>
</center>

</body>
</html>

Commentaire de hpfx le 12/08/2011 10:09:16

salut,
pour ceux qui ont un probleme de décallage, voici comment j'ai corrigé ce probleme dans faire de bidouille,
j'ai avant tout ajouté une fonction qui calcule réellement la position de l'image :

FindXY:function(obj) //donnes les coordonnées d'un objet sur la page
{
var x=0,y=0;
while (obj!=null)
{
x+=obj.offsetLeft-obj.scrollLeft;
y+=obj.offsetTop-obj.scrollTop;
obj=obj.offsetParent;
}
return {x:x,y:y};
},

et ensuite, dans la fonction loupe, j'ai modifié lesderniere ligne  ainsi :
(c'est pas optimisé pour que ca puisse être comprehensible)

var o=kloupe.FindXY(igmp);
var PosX=evt.clientX+dde.scrollLeft; // position XY de la souris dans la page
var PosY=evt.clientY+dde.scrollTop;
var dx=PosX-o.x; // position relative dans l'image
var dy=PosY-o.y;
grande_image.style.left=-((dx)*kloupe.facteur*kloupe.mooz)+(clic.offsetWidth/2)+'px';
grande_image.style.top=-((dy)*kloupe.facteur*kloupe.mooz)+(clic.offsetHeight/2)+'px';

on pourait ameliorer ceci en ne lancant FindXY() qu'une seule fois (sauf si l'image se deplace une fois la page chargée...)

 Ajouter un commentaire


Discussions en rapport avec ce code source dans le forum

Zoom genre loupe sur image [ par Annadrill ] Bonjour, voilà, j'essaie de réaliser quelque chose de ce genre http://www.magictoolbox.com/magicmagnify/ mais je ne sais pas par ou commencer, m'y co Zoom sur graphique en javascript ou php [ par nico00 ] Bonjour à tous j'ai fais un programme qui affiche des signaux en php voici le code: <?php restore_error_handler(); error_reporting(E_ALL & ~E_STRICT); Ouvrir une image à partir d'une zone cliquable avec un effet de zoom? [ par bahh66 ] Bonjour, je pose cette question ici mais je ne suis pas sur d'être au bon endroit... Je dois réaliser un cd-rom pour une présentation de musée. J'ai Zoom A+ et A- IE ou firefox (ctrl + - ou ctrl + -) dans une page web (et idem Volume) [ par thierryd75 ] Bonjour, Je suis en train de développer un site web et je cherche le moyen d'augmenter le zoom (75 - 100% - 125 %) de ma page via ma page pour la vis Zoom [ par fuksan ] Bonjour, J'ai trouvé une multitude de Zoom en cherchant dans le site. Cependant, je n'ai pas réussi à trouver exactement celui que je cherche. En fa Zoom image [ par etu54 ] Bonjour, De par mes études je suis dans la programmation web depuis 1 an environ. Cependant le javascript m'est encore assez inconnu mis a part les [XML/SVG] zoom sur plusieurs éléments [ par BARIS69330 ] Bonjour, je bosse actuellement sur du svg et il me faut faire un zoom sur plusieurs evenements quand je passe la souris dessus grâce aux fonctions onm script pour zoom (comme google maps) [ par Rose6 ] salut, je repose ma question car je n'ai obtenu aucune réponse satisfaisante... connaissez vous un script pour zoomer et se déplacer sur une image ( comportement de google chrome "TRES ETRANGE" [ par WiDOC ] Bonjour, alors voila j'ai un bug plutôt "hors du commun" je trouve. en fait c'est peut être même pas un bug mais un fonctionnement de google chrome q Image SVG coupée lors d'un zoom [ par Pitus38 ] Bonjour à tous, J'ai un petit soucis avec mon image SVG, je gère la fonction mousewheel pour agrandir et réduire en zoomant et dézoomant avec la mole


Nos sponsors


Sondage...

Comparez les prix

CalendriCode

Mai 2012
LMMJVSD
 123456
78910111213
14151617181920
21222324252627
28293031   

Consulter la suite du CalendriCode

A découvrir



 
Développement réalisé par Nicolas SOREL (Nix) avec l'aide de : Cyril DURAND et Emmanuel (EBArtSoft), Merci à Vincent pour ses précieux conseils.
CodeS-SourceS.com© Toute reproduction même partielle est interdite sauf accord écrit du Webmaster
CodeS-SourceS.com© est une marque déposée tous droits réservés

Google Coop CodeS-SourceS Google Coop CodeS-SourceS
Temps d'éxécution de la page : 0,359 sec (4)

Nous contacter | Annoncer sur CodeS-SourceS | Mentions légales