2017-10-19 7 views
0

je cherche à beaucoup d'exemple pour l'agrandissement d'une image avec la même imageCliquer forme SVG et agrandir une autre image

$("#imgSmall").click(function(){             
    $("#imgBig").attr("src","http://www.freeimageslive.com/galleries/space/earth/pics/a17_h_148_22718.gif"); 
    $("#overlay").show(); 
    $("#overlayContent").show(); 
}); 

$("#imgBig").click(function(){ 
    $("#imgBig").attr("src", ""); 
    $("#overlay").hide(); 
    $("#overlayContent").hide(); 
}); 

http://jsfiddle.net/a8c9P/

Ce que je cherche est en cliquant forme SVG (au lieu d'une image), et agrandir pour montrer une autre image (au lieu de montrer la même image précédemment). J'utilise jquery pour cela.

+0

Le SVG est traité comme une image. Utilisez simplement SVG au lieu de JPG ou PNG comme d'habitude et réglez la largeur/hauteur en conséquence. – freeworlder

+0

La solution @freeworlder mentionnée est probablement la plus simple (il suffit de sauvegarder l'image en SVG, de la placer quelque part, et d'utiliser .svg dans votre imr src), mais vous pouvez aussi attacher un écouteur click à un élément SVG. Exemple: https://jsfiddle.net/xq8f18b5/ –

Répondre

0

Un fichier SVG est traité exactement comme une image dans n'importe quel navigateur. Faites simplement référence au SVG comme vous le feriez pour toute image et taille en conséquence:

<img src="images/vector.svg" style="width:400ps;height:400px/>