ZorNet.Ru — сайт для вебмастера » Скрипты для uCoz » Всплывающее изображения в Lightbox для uCoz

Всплывающее изображения в Lightbox для uCoz

Всплывающее изображения в Lightbox для uCoz
Много таких типа кодов, но встретился в первые и очень понравился этот материал Всплывающее изображения в Lightbox для uCoz которое на системе будет отличным решением стандартному виду. Но вы можете установить на какой то модуль, скажем фото где, это безусловно фотоальбом и там он будет как дома, так как почти для этого и создан.

И так представляю вам ещё одни не плохой скрипт для реализации ваших идей на вашем сайте uCoz. Я уже выкладывал несколько идей как можно вызывать изображения, то есть при нажатие изображения оно увеличивается. В этот раз я вам предлагаю другой вариант не менее интересный. Всплывающее изображения в стиле лайтбокс «Simple Modal Box With JQuery» при нажатие на маленькое изображение будет вам его увеличивать и с низу будет панель с возможностью пролистать изображения и естественно закрыть его. Так при перелистывание фото будет красивый эффект загрузки изображения.

Установка скрипта

HTML

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

Код
<div id="wrapper">  

  <ul id="images">  
  <li>  
  <a href="$IMG_URL1$" rel="gallery"  
  title="Carnival" class="lightbox">  
  <img src="$IMG_URL1$" alt="Carnival"  
  width="150" height="83" />  
  </a>  
  </li>  
  <li>  
  <a href="$IMG_URL2$" rel="gallery"  
  title="Holiday Property" class="lightbox">  
  <img src="$IMG_URL2$"  
  alt="Holiday Property"  
  width="150" height="83" />  
  </a>  
  </li>  
  <li>  
  <a href="$IMG_URL3$" rel="gallery"  
  title="Carpenter" class="lightbox">  
  <img src="$IMG_URL3$"  
  alt="Carpenter"  
  width="150" height="83" />  
  </a>  
  </li>  
  </ul>  

</div>


Далее вам следует в верхнюю или нижнюю часть сайта прописать стили и скрипт к данному скрипту и для этого скопируйте код ниже.

Код
<script src="http://zornet.ru/Ajaxoskrip/Forma_skriptov/tygsa/core.js" type="text/javascript"></script>  
<link href="http://zornet.ru/Ajaxoskrip/Forma_skriptov/tygsa/core.css" rel="stylesheet" type="text/css" />


Вот и всё мы установили скрипт который поможет вам красиво и удобно выводить изображения ваших материалов.
09 Октября 2015 Просмотров: 3419 Комментариев: (8)

Поделиться в социальных сетях

Материал разместил

Оставь свой отзыв

Комментарии: 8
Сопрано
Сопрано 09 Октября 2015 04:051
0
Это адаптация как понял.
Kosten
Kosten 09 Октября 2015 04:082
0
Но где можно увидеть при создание сайта на uCoz такую функцию и ответ сам напрашивается сказать, безусловно это не от системы а адаптированное под не.
Сопрано
Сопрано 09 Октября 2015 04:103
0
Но это понятно, просто уточнить не мешало бы. А так красиво смотрится, все думаю на вид материала поставить и вот как правильно сделать, но и понимаю, что это почти не возможно.
Canon
Canon 09 Октября 2015 04:124
0
У меня такое ощущение, что uCoz так создан, что можно все под него сделать. Не разу не видел скрипт или шаблон на адаптацию от системы на другой хостинг.
Kosten
Kosten 09 Октября 2015 04:155
0
Что есть то есть, но не нужно забывать что это конструктор и под него можно много чего сделать. Главное, к примеру адаптация была грамотной.
DALMATIN
DALMATIN 09 Октября 2015 05:596
0
Это адаптация с html версии и ucoz в значительности не чем не отличается от других CMS так как у всех стили и коды одинаковые и если должны ставить столбиком то раком не пойдёт хоть на ucoz хоть на другую cms.

Вообще много обсирают ucoz хотя просто не могут или не хотять что то делать а так возможно всё то что на других cms просто нужно хотеть это .
kos
kos 09 Октября 2015 20:457
0
Имеется в виду перелистывание в лайтбоксе, так как это работает в фотоальбомах?
FeStemBer
FeStemBer 29 Декабря 2015 19:268
0
Так очень оригинально смотрится это увеличение, думаю его можно много где применить и не исключаю сам вид материала на главной странице.

avatar