CodeLAB
на главную карта сайта обратная связь

Популярные задачи:

#Пирамидальная сортировка. (203453 hits)
#Сапер. (53312 hits)
#Выборка всех записей таблицы. (33425 hits)
#Рисование 3D объекта. (35060 hits)
#Валидация, динамическая проверка заполнения html форм. (209087 hits)
#Плоттеры для рисования графиков. (29624 hits)
#Посчитать количество пар чисел (number of equal pairs). (4541 hits)
#Утилиты. (114297 hits)
#Преобразование RGB в HEX и обратно HEX в RGB. (56665 hits)
#Добавление истории операций(undo&redo) в компонент. (39909 hits)
#Подсветка синтаксиса. (31381 hits)
#Сглаживание кривой В-сплайном. (38677 hits)
#Динамическое изменение цвета полоски прокрутки в IE5.5 и выше. (30856 hits)
#Простой генератор случайных чисел. (133855 hits)
#Вычисление эксцесса и коэффициентов асимметрии заданной выборки. (45719 hits)
#Вычисление значения полинома. (62023 hits)
#"The Java Programming Language" Ken Arnold, James Gosling, David Holmes листинги, код, примеры из книги, исходники. (60977 hits)
#Бинарный поиск в массиве и его разновидности. (169037 hits)
#Как посчитать одинаковые пары за 1 проход (самая быстрая версия!). (2061 hits)
#Арктангенс. (45418 hits)


Главная >> Каталог задач >> Веб-разработка >> Клиентский скриптинг(js, vba и т.д.) >> popup ("всплывающие") динамические окна >> Просмотр изображения во всплывающем окне

Просмотр изображения во всплывающем окне

Aвтор:
Дата:
Просмотров: 89156
реализации(javascript: 1шт...) +добавить

Для многих изображений, публикуемых на сайте, очень часто нужно обеспечить просмотр этой картинки в увеличенном(полном) размере. 2 основных пути для достижения этого - открытие дополнительного popup окна и динамическая вставка новой большой картинки вместо старой(с растяжением дизайна страницы либо без него - поверх)

Здесь рассматривается первый вариант, т.е. дополнительное popup-окно. Очень часто в этом случае создается, верстается дополнительная html-страница, содержащая минимальный код с этим тегом img отображающим большую картинку. Довольно трудоемкий и сложный для последующей поддержки способ: для любой картинки необходимо создавать новую страницу, и при любом изменении изображения менять приходится обычно в нескольких местах.

Поскольку существует возможность непосредственно из javascript-а задать содержимое (html-код) этого popup окна - то можно легко избавится от всех этих недостатков.

А именно - создаем специальную функцию, по-интерфейсу схожую с window.open (чтобы легче запоминалась), которой вместо url документа - будет задаваться адрес картинки. Далее эта функция сама будет создавать этот примитивный html-код, требуемый для отображения этой картинки.

+ Попутно было бы неплохо обеспечить этот popup и другими некоторыми удобствами как: автоматическое подстраивание под размер картинки, центрирование по центру экрана, закрытие по клику и т.д.

Реализации:

javascript(1)   +добавить

1) Просмотр изображения во всплывающем окне на javascript, code #192[автор:this]