JQuery: Как показать всплывающее изображение по щелчку эскиза?

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

Существуют ли какие-либо плагины, которые могут это сделать?

Ответ 1

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

Thickbox

LightBox

FancyBox

FaceBox

NyroModal

PiroBox

Примеры Thickbox

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

Создать элемент ссылки()

Дайте ссылке атрибут класса со значением thickbox (class= "Thickbox" )

Предоставить путь в атрибуте href к файлу изображения (.jpg.jpeg.png.gif.bmp)

Ответ 2

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

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

Ответ 3

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

WOWslider

Желаем удачи

Ответ 4

prettyPhoto - это клон lQuery lightbox. Он не только поддерживает изображения, но также поддерживает видео, флеш, YouTube, iframes и ajax. Его полноэкранный медиа-лайтбокс

Ответ 5

Это самая популярная (9500 звезд) и небольшая (20 КБ minify, 7.5 КБ minify + gzip). Я думаю: Magnific-Popup