Увеличение изображения при клике







Моя дорога в изучении HTML, PHP, CSS и MySQL

Украшаем сайт


2. Увеличение изображения при клике

При создании сайта для кафе, мне хотелось, чтобы фото на странице меню можно было увеличить при клике на нём. При поиске нашла архив папки highslide и описание, как получить нужный эффект. Скачала архив, выполнила все подсказки и получила то, что было нужно. Кликните по фото ниже и увидите увеличенное фото.

Мне понравилось то, что не нужны два файла. Один файл фото размера, который будет при увеличении находится в папке сайта. В html-коде указываем размер, который будет на странице до увеличения. Ширину я задаю сама нужную. Как узнать высоту при данной ширине? Открываю фото в GIMP, в меню: Изображение - Размер изображения задаю нужную ширину и вижу, какой будет высота при такой ширине. Запоминаю, нажимаю кнопку Отмена.

Лучше увидеть, как это делается. Выкладываю архив foto.zip (324 КБ), в котором папка highslide (распространяется с открытым кодом), html-файл и фото. Нет ничего лишнего, поэтому понятно, что писать в html-коде. О highslide достаточно информации в Интернете. Задайте в поиске, например: highslide - красивая галерея.








Copyright © 2015. Хайманова Татьяна Яковлевна. Все права защищены.