Приветствую Вас Прохожий | RSS Суббота, 03.12.2016, 20:40
Меню сайта
ВИДЕО УРОКИ СКРИПТЫ UCOZ ШАБЛОНЫ UCOZ ФОТОШОП UCOZ КАТАЛОГ СТАТЕЙ ВЕБМАСТЕРУ UCOZ ВИДЕО ФОТОШОПА ДОПОЛНЕНИЕ САЙТА РАЗДЕЛ СТУДИИ УСЛУГИ НАШЕГО САЙТА


Мини-чат
Все вопросы задаем в форуме,
здесь они игнорируются!



Статистика
Онлайн всего: 16
Гостей: 15
Пользователей: 1
LESIYI



Главная » Файлы » Скрипты для uCoz » Скрипты информеры

Слайдер для кино сайтов на uCoz через информер

Слайдер для кино сайтов на uCoz через информер Слайдер, кино, сайтов, uCoz, через, информер
Предлагаю вашему вниманию скрипт и стиль для слайдера предназначенного для кино сайтов на uCoz через использование информеров, с выводом последних к примеру фильмов или игр. Просмотрите сам вид того какого он размера и что он отображает, все картинки должны быть одного желаемого размера, к примеру постеры к фильму, или игре, выводится картинка сама, название с выделением, так же его категория.
Мы использовали модуль news новости, вы можете подставить в любой другой модуль только измените настройке при создание информаторов , с именем названия категорий раздела, и самим названием.
Для вывода информации мы используем два блока с информерами, в том что они работают одинаково с обновлением не даст иметь смещение названия от постера картинки, все будет появляться синхронно, для тех кто не понимает смысл этого объясняю, 4 инфор. нам выводит название а 5 саму картинку с категорией раздела и ссылкой на материал.
При наведение на название интересующее вас выделяется строка, и показывается скрин к этой новости моментально с плавным переходом на библиотеке с

Слайдер создавался на сайте ucozon.ru под заказ, заказчик от него отказался и за того что он значительно нагружает страницу при обновление страницы или первом заходе, всему причина от большей части вес графического элемента, если вес не будет превышать более чем 15-25 кб то проблем не должно быть, но все же перед использование обратите внимание в разных браузерах в несколько обновлений страниц.
Сделан был блок из разработок официальных сайта jquery и переделан в виде отображения и формы размеров под определенный сайт. Форма статическая!

Изменить цвет, и форму не очень сложно, даже расположение картинки с лева на право или наоборот.

Установка и настройка с использованием собственных новостей:
В < head > страницы вставляем код скриптов с библиотеками проигрывания jquery
Code
<script type="text/javascript" src="http://ucozon.ru/SCRIN7/2/00121/js/jquery-ui.min.js" ></script>  
  <script type="text/javascript"> $(document).ready(function(){ $("#featured > ul").tabs({fx:{opacity: "toggle"}}).tabs("rotate", 5000, true); }); </script>
В то место вашего шаблона где желаем видеть отображение слайдера вставляем код с информерами предварительно создав два информатора:
Code
<div id="featured">  
<ul class="ui-tabs-nav">  
$MYINF_4$
</ul>  
$MYINF_5$
</div>
Можно и таким способом вывести, разницы не какой, последний вариант это для отображения на другом сайте.
$MYINF_4$ = http://ucozon.ru/informer/4
Code
<div id="featured">  
<ul class="ui-tabs-nav">  
<script type="text/javascript" src="http://ucozon.ru/informer/4"></script>
</ul>  
<script type="text/javascript" src="http://ucozon.ru/informer/5"></script>  
</div>
Создаем инфор. № 4настройки-
[ Новости сайта · Материалы · Дата добавления материала D · Материалы: 10 · Колонки: 1 ]
вставляем с заменой следующий код:
Code
<li class="ui-tabs-nav-item<?if($NUMBER$="1")?> ui-tabs-selected<?endif?>" id="nav-fragment-$NUMBER$">  
<a href="#fragment-$NUMBER$" onMouseOver="click('')" style="padding-left:5px;"><span><b><?if(len($TITLE$)>40)?><?substr($TITLE$,0,39)?>...<?else?>$TITLE$<?endif?></b></span></a></li>
Создаем инфор. № 5 настройки-
[ Новости сайта · Материалы · Дата добавления материала D · Материалы: 10 · Колонки: 1 ]
вставляем с заменой следующий код:
Code
<div id="fragment-$NUMBER$" class="ui-tabs-panel" style=""><a href="$ENTRY_URL$"><img src=" $IMG_URL1$ " alt="" height="290" width="220"></a><div class="info"><h2>  
  <a href="$CATEGORY_URL$">Смотреть все..<blink>.</blink></a></h2><p>$CATEGORY_NAME$</p></div></div>



В таблицу стилей вставляем сам стиль CSS:
Code
#featured{  
  width:495px;  
  padding-right:230px;  
  position:relative;  
  border:5px solid #79B0FB;  
  height:292px;  
  background:#79B0FB;
}
#featured ul.ui-tabs-nav{  
  position:absolute;  
  top:0; right:220px;  
  list-style:none;  
  padding:0; margin:0;  
  width:500px;  
}
#featured ul.ui-tabs-nav li{  
  padding:1px 0; padding-right:13px;  
  font-size:12px;  
  color:#ffffff;  
}
#featured ul.ui-tabs-nav li img{  
  float:right; margin:2px 5px;  
  background:#ffffff;  
  padding:2px;  
  border:1px solid #eee;
}
#featured ul.ui-tabs-nav li span{  
  font-size:11px; font-family:Verdana;  
  line-height:18px;  
}
#featured li.ui-tabs-nav-item a{  
  display:block;  
  height:27px;  
  color:#ffffff; background:#6FA6F1;  
  line-height:20px;
}
#featured li.ui-tabs-nav-item a:hover{  
  background:#79B0FB;  
}
#featured li.ui-tabs-selected{  
  background:url('http://ucozon.ru/_dr/61/69710971.png') top right no-repeat;  
}
#featured ul.ui-tabs-nav li.ui-tabs-selected a{  
  color:#ebebeb; background:#659CE7;  
}
#featured .ui-tabs-panel{  
  width:220px; height:290px; right:-505;
  background:#2D9F45; position:relative;
}
#featured .ui-tabs-panel .info{  
  position:absolute;  
  top:250px; right:0;  
  height:42px;  
  width:220px;
  background: url('http://ucozon.ru/_dr/61/56640692.png');  
}
#featured .info h2{  
  font-size:16px; font-family:Georgia, serif;  
  color:#fff; padding:5px; margin:0;
  overflow:hidden;  
}
#featured .info p{  
  margin:0 8px;  
  font-family:Verdana; font-size:10px;  
  line-height:10px; color:#FDFDFD;
}
#featured .info a{  
  text-decoration:none;  
  color:#fff;  
}
#featured .info a:hover{  
  text-decoration:underline;  
}
#featured .ui-tabs-hide{  
  display:none;  
}


Автор\Источник: http://ucozon.ru

Для того что бы скачать архив необходимо зайти на сайт как пользователь.
Просмотров: 6718 | Рейтинг: 4.0/6 | |Категория: Скрипты информеры | Добавил: mdbaner | Дата: 16.09.2012 | Скачали: 0 | Теги: кино, информер, через, сайтов, ucoz, слайдер
Похожие новости на нашем сайте
Коментарий к новости

Всего комментариев: 0

Добавлять комментарии могут только зарегистрированные пользователи.
[ Регистрация | Вход ]

Форма входа
Логин:
Пароль:


Поиск


На форуме

1 Куплю сайты с ТИЦ/PR (п...

9

2 Предлагаю услуги для ан...

0

3 Предлагаю услуги по про...

0

4 Комплексный прогон сайт...

51

5 Сайт онлайн фильмов на ...

1

6 Проблема с таблицей

9

7 Отредактировать фото

2

8 Уже все перепробовал )

1

9 Скрипт "Нравится&q...

3

10 Меню для сайта

3


Подробней о форуме


Комментарии



Copyright UcozOn.ru™ © 2008-2016


Кнопка 88х31 сайта ucozon.ru