jQuery: Как я могу показать всплывающее окно с изображением при нажатии на миниатюру?

Question

На моей странице aspx у меня есть уменьшенное изображение <img>. Когда пользователь нажимает на это изображение, я хочу, чтобы всплывающее окно показывало, что оно блокирует остальную часть пользовательского интерфейса с увеличенной (полной) версией изображения.

Есть ли плагины, которые могут это сделать?

Answer 1

Для этого доступно множество плагинов jQuery

Thickbox

LightBox

FancyBox

FaceBox

NyroModal

PiroBox

Примеры толстых коробок

Для одного изображения

1. Создать элемент ссылки ()
2. Дайте ссылке атрибут класса со значением Thickbox (Класс = "Thickbox")
3. Укажите путь в атрибуте href к файлу изображения (.jpg .jpeg .png .gif .bmp)

Answer 2

Мне нравится prettyPhoto

prettyPhoto - это клон jQuery lightbox .Он не только поддерживает изображения, но также поддерживает видео, flash, YouTube, iframes и ajax.Это полноценный медиа лайтбокс

Answer 3

Это самая популярная (9500 звезд) и легковесная (20 КБ минимизировать, 7,5 КБ минимизировать + gzip) всплывающая галерея. Я думаю: Magnific-Popup

Answer 4

Извините за публикацию в такой старой теме. Я был в той же ситуации, и я нашел другое решение, которое работало бы лучше для меня (мне не пришлось кодировать)

WOWslider

Удачи

Answer 5

prettyPhoto - это клон лайтбокса jQuery.Он не только поддерживает изображения, но также поддерживает видео, flash, YouTube, iframes и ajax.Это полноценный медиа лайтбокс