2017-10-19 13 views
0

Ich habe zur Vergrößerung eines Bildes mit dem gleichen BildEin Klick SVG Form und vergrößern mit einem anderen Bild

$("#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/

Was ich suche ist, klicken SVG Form bei einer Menge Beispiel suchen (anstelle eines Bildes) und vergrößern, um ein anderes Bild zu zeigen (anstatt das gleiche Bild vorher zu zeigen).

Ich benutze jquery, um dies zu tun.

+0

SVG behandelt die gleiche wie ein Bild. Verwenden Sie einfach wie gewohnt SVG statt JPG oder PNG und stellen Sie die Breite/Höhe entsprechend ein. – freeworlder

+0

Die Lösung @freeworlder ist wahrscheinlich die einfachste (speichern Sie einfach das Bild als SVG, platzieren Sie es irgendwo und verwenden Sie .svg in Ihrem img src), aber Sie können einen Klick-Listener auch an ein SVG-Element anhängen. Beispiel: https://jsfiddle.net/xq8f18b5/ –

Antwort

0

Ein SVG wird in jedem Browser genau wie ein Bild behandelt. Referenzieren Sie einfach das SVG wie Sie ein Bild und Größe entsprechend:

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