Изображение Javascript pop-up

Question

Я ищу решение для всплывающего изображения.

Обычное изображение для увеличения при щелчке мышью. Идея должна быть чем-то вроде всплывающего окна Highslide. Я хотел бы назначить событие с помощью CSS. например, если тег img имеет определенный класс, изображение должно быть увеличено.

Возможно, у кого-то есть хорошее решение.

Answer 1

Пробег: fancybox. У них есть демонстрации на сайте и примеры кода, поэтому вы должны иметь возможность выяснить, как вызвать его только на элементах с определенным классом.

$('img.someClass').fancybox({/* ..whatever options you want.. */ }); 

Answer 2

попробовать этот jsfiddle: http://jsfiddle.net/3Z8RZ/37/

HTML:

<button>bigger</button> 
<img class="smaller" src="http://upload.wikimedia.org/wikipedia/commons/thumb/2/26/YellowLabradorLooking_new.jpg/260px-YellowLabradorLooking_new.jpg"> 

JS:

 $(document.body).on('click', 'button', function() {   
     $('img').toggleClass('bigger');  
    });​ 

CSS:

.smaller{ 
width:50px; 
height:50px; 
} 
.bigger{ 
    width:250px; 
    height:250px; 
}​