Гость
Статистика Форума
Последнии темы Популярные темы Лучшии пользователи Новые пользователи
» [20.11.2018] Старый добрый снежок из 2007 года на jQuery (0)
» [17.11.2018] Группа Кровавой Дороги [ГКД] (0)
» [17.11.2018] Анимат на форуме для uCoz (0)
» [17.11.2018] Скрипт: Новости по теме для uCoz (0)
» [17.11.2018] Скрипт "Орфограф" beta для uCoz (0)
» [16.11.2018] Бар "100 Рентген" (3)
» [09.11.2018] Инверсия | Inversion (2)
» [09.11.2018] Как оформить тему? (0)
» [09.11.2018] S.T.A.L.K.E.R. 2 (1)
» [09.11.2018] Даты выхода модов Сталкер (2)
» Тайники и подсказки (82)
» FAQ прохождения по локациям DOPPELGANGER 7.63 Time Gap (50)
» Русскоязычное руководство по моду Frackin' Universe... (38)
» Фоны для сталкерского сайта (32)
» Capital-Rp Wikia Code (22)
» ГИД Прохождение остальных квестов ОП - 2 (21)
» CoC Вылеты и их решение (21)
» Личные сообщения (18)
» Редактирование мода «Народная солянка Объединенный пак ... (18)
» Проблемы в модуле "Пользователи" (17)
» Xemordio (2887)
» NL-Vincenz (11)
» Duzeppa26 (5)
» Ghosteron (4)
» Glomar (1)
» Бармен (1)
» Даниил_Хороший (1)
» marinak1984 (0)
» johnnym (0)
» LENA_D (0)
» [16.11.2018] d0om801
» [13.11.2018] parabranma
» [13.11.2018] doon80
» [12.11.2018] lemberg123
» [09.11.2018] alurongdannov
» [09.11.2018] NL-Vincenz
» [07.11.2018] eugen55eugen
» [07.11.2018] kadastrapro
» [22.10.2018] subbotin440
» [19.10.2018] goooooooooogle380

  • Страница 1 из 1
  • 1
Форум » Web uCoz » Скрипты для uCoz » Эффекты увеличения изображений через плагин Cloud Zoom
Эффекты увеличения изображений через плагин Cloud Zoom
Xemordio Online Дата: Воскресенье, 10.06.2018, 07:43 | Сообщение # 1
Администратор
Звание: Генерал [?]
Сообщений: 2887

Неплохой плагин с несколькими видами увеличения картинок
Если эффекты увеличения впечатлили, переходим к установке:
В ‹head› на всех страницах сайта, где будет применяться данный плагин, вставляйте следующий код:
Код
<link href="/css/cloud-zoom.css" rel="stylesheet" type="text/css" />

Далее после ‹/head› на тех же страницах вставляйте:
Код
<script type="text/JavaScript" src="/js/cloud-zoom.min.js"></script>

Теперь в то место, где будут располагаться картинки, обрабатываемые плагином zoom вставляйте:
1) Для эффекта появления увеличенного изображения справа от картинки:
Код
<a href='Ссылка на большое изображение' class = 'cloud-zoom' id='zoom1' rel="tint: '#ff0000',tintOpacity:0.5 ,smoothMove:5,zoomWidth:480, adjustY:-4, adjustX:10">
<img src="Ссылка на уменьшенное изображение" title="Название или описание картинки" />
</a>

Обратите так же внимание, что для каждой новой картинки, которая будет обработана этим эффектом, необходимо указать свой id (id='zoom2', id='zoom3' и т.д.);
2) Для эффекта появления увеличенного изображения внутри исходной картинки:
Код
<a href="Ссылка на большое изображение" class="cloud-zoom" id="zoom1" rel="position:'inside' , showTitle:false, adjustX:-4, adjustY:-4">
<img src="Ссылка на уменьшенное изображение" title="Название или описание картинки" />
</a>

Здесь тоже не забудьте проставить для каждой новой картинки свой id (id='zoom2', id='zoom3' и т.д.);
Теперь осталось лишь залить папки из архива в корень вашего сайта
Всё! Материал подготовлен Apocalypse.

[grayb]Скачать материал: https://yadi.sk/d/DZSwep9E3XdccZ[/grayb]
Дата регистрации: 22.07.2017
Форум » Web uCoz » Скрипты для uCoz » Эффекты увеличения изображений через плагин Cloud Zoom
  • Страница 1 из 1
  • 1
Поиск:

10:27