Заработок в интернете и раскрутка вашего сайта Воскресенье, 20.08.2017, 03:15
[ Новые сообщения · Участники · Правила форума · Поиск · RSS ]
Страница 1 из 11
Форум » Создание сайта » HTML коды для uCoz » Лайтбокс (Lightbox) с надписью для uCoz (Лайтбокс (Lightbox) с надписью для uCoz)
Лайтбокс (Lightbox) с надписью для uCoz
adminДата: Понедельник, 23.12.2013, 11:26 | Сообщение # 1
Главный админ
Группа: Администраторы
Сообщений: 336
Награды: 0
Репутация: 1
Статус: Offline
Лайтбокс (Lightbox) с надписью для uCoz

    Тут описано создание красивого окошка Лайтбокс (Lightbox) с нужной Вам надписью для сайтов с бесплатным хостингом uCoz. Для создания такого окна у Вас должны быть хотя бы минимальные знания системы uCoz и кода написания сайтов HTML!

Итак про установку читайте чуть ниже!

HTML код блока!


Код
<div id="id1" style="display:none;">Любой ваш контент</div>  
<a href="#id1" class="ulightbox">Открыть лайтбокс с содержимым блока id1</a>


Это идёт в

Код
<script>   
// ApoTeam (c) 2013  
  $('.ulightbox').fancybox({  
   padding: 3, // Ширина белой рамки вокруг картинки  
   preload: 3, // Количество картинок, которые загружаются предварительно  
   openEffect: 'fade', // Эффект появления (elastic - растягивание, fade - проявление, none - без эффекта)  
   closeEffect: 'fade', // Эффект исчезания (elastic - растягивание, fade - проявление, none - без эффекта)  
   nextEffect: 'fade', // Эффект перехода вперёд (elastic - растягивание, fade - проявление, none - без эффекта)  
   prevEffect: 'fade', // Эффект перехода назад (elastic - растягивание, fade - проявление, none - без эффекта)  
   openEasing: 'linear', // Тип анимации появления  
   nextEasing: 'linear', // Тип анимации при переходе вперёд  
   prevEasing: 'linear', // Тип анимации при переходе назад  
   fixed: fixedFlag,  
   helpers: {  
   title: null, // Заголовок по умолчанию  
   overlay: {  
   opacity: 0.7, // Непрозрачность оверлея  
   speedIn: 0, // Скорость появления оверлея  
   speedOut: 0 // Скорость угасания оверлея  
   },  
   buttons: {}  
   }  
});  
// apo-ucoz.com (c) 2013   
</script>


CSS стили

Код
#fancybox-buttons {  
  display:none; /* Скрываем глупую верхнюю кнопку масштабирования */  
}  

#fancybox-overlay {  
  background: #ff0000 !important; /* Цвет оверлея */  
}



data-yashareType="button" data-yashareQuickServices="yaru,vkontakte,facebook,twitter,odnoklassniki,moimir,lj,gplus">


Нравится
 

Нравится







Форум » Создание сайта » HTML коды для uCoz » Лайтбокс (Lightbox) с надписью для uCoz (Лайтбокс (Lightbox) с надписью для uCoz)
Страница 1 из 11
Поиск:

Заработок в интернете и продвижение вашего сайта © 2013-2017
Копирование материалов сайта без согласия запрещено!

Яндекс.Метрика

СЕГОДНЯ НАС ПОСЕТИЛИ:

200