Clicking SVG shape and enlarge with another Image

Question

I have been looking at a lot of example for enlarging an image with the same 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/

What I am looking for is clicking SVG shape (instead of an image), and enlarge to show another image (instead of showing the same image previously).

I am using jquery to do this.

Answer 1

An SVG is treated exactly as an image in any browser. Just reference the SVG as you would any image and size accordingly:

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