Image Zoom Using Simple Jquery

Image Zoom Using Simple Jquery

HTML

<img src="https://encrypted-tbn3.gstatic.com/images?q=tbn:ANd9GcQnQVaso5Q5SmV0gl_15PHr4CyvUYkBwGkx4qSVD9YaovnSKWqi" class="ImageOver" />
<img src="https://encrypted-tbn3.gstatic.com/images?q=tbn:ANd9GcQnQVaso5Q5SmV0gl_15PHr4CyvUYkBwGkx4qSVD9YaovnSKWqi" class="ImageOver" />
<img src="https://encrypted-tbn3.gstatic.com/images?q=tbn:ANd9GcQnQVaso5Q5SmV0gl_15PHr4CyvUYkBwGkx4qSVD9YaovnSKWqi" class="ImageOver" />
<img src="https://encrypted-tbn3.gstatic.com/images?q=tbn:ANd9GcQnQVaso5Q5SmV0gl_15PHr4CyvUYkBwGkx4qSVD9YaovnSKWqi" class="ImageOver" />

CSS

.ImageOver
{ 
 width:50px;
 height:50px;   
}

.ImageOver.ImageOverActive
{
 width:150px;
 height:150px;   
}

JavaScript

$(document).ready(function () {   
    $('.ImageOver').click(
        function () { $(this).addClass('ImageOverActive'); }, 
        function () { $(this).removeClass('ImageOverActive'); });
});