Главная » Файлы » Прочие скрипты » jQuery

Блок Друзья сайта на jQuery для uCoz by Apocalypse
22.06.14, 19:57:48

Скачать файл




Скрипт представляет собой прокручиваемый блок, в который можно вставить баннеры или скриншоты сайтов ваших друзей и партнёров. Скрипт основан на jQuery и используется движок "Карусель" весом всего в 2КБ!!! smile

Итак, приступим. В глобальный блок "Нижняя часть сайта" вставляйте следующий код (В принципе, не обязательно вставлять в Нижнюю часть сайта... Можете вставить и в более удобное для вас место, но в этом случае скриптовую часть впишите в head)
Код
<script src="http://apocalypse.ucoz.kz/js/carousell.js"></script>  
  <script>  
  $(function() {  
$(".anyClass").jCarouselLite({  
btnNext: ".next",  
btnPrev: ".prev"  
});  
  });  
  </script>


Двлее вот как оформляются сами баннеры (Если размещаете в Нижней части сайта - вписывайте сразу же под первым кодом, если в произвольное место - вписывайте туда, где будут ваши баннеры):
Код
<center>  
  <button class="prev"><<</button>  
  <button class="next">>></button>  
  <div class="anyClass">  
<ul>  

  <li>  
  <table border="0" cellpadding="0" cellspacing="0">
<tbody><tr>
<td width="17" background="http://apocalypse.ucoz.kz/border/1.png" height="17">
</td>
<td background="http://apocalypse.ucoz.kz/border/2.png" height="17">
</td>
<td width="17" background="http://apocalypse.ucoz.kz/border/3.png" height="17">
</td>
</tr>
<tr>
<td width="17" background="http://apocalypse.ucoz.kz/border/4.png">
</td>
<td>  
  <a href="Сссылка на сайт 1" title="Описание сайта" target="blank"><img src='Ссылка на баннер' width="Ширина баннера" height="Высота баннера"></a>  
  </td>
<td width="17" background="http://apocalypse.ucoz.kz/border/5.png">
</td>
</tr>
<tr>
<td width="17" background="http://apocalypse.ucoz.kz/border/6.png" height="17">
</td>
<td background="http://apocalypse.ucoz.kz/border/7.png" height="17">
</td>
<td width="17" background="http://apocalypse.ucoz.kz/border/8.png" height="17">
</td>
</tr>
</tbody></table>  
  </li>  

  <li>  
  <table border="0" cellpadding="0" cellspacing="0">
<tbody><tr>
<td width="17" background="http://apocalypse.ucoz.kz/border/1.png" height="17">
</td>
<td background="http://apocalypse.ucoz.kz/border/2.png" height="17">
</td>
<td width="17" background="http://apocalypse.ucoz.kz/border/3.png" height="17">
</td>
</tr>
<tr>
<td width="17" background="http://apocalypse.ucoz.kz/border/4.png">
</td>
<td>  
  <a href="Сссылка на сайт 2" title="Описание сайта" target="blank"><img src='Ссылка на баннер' width="Ширина баннера" height="Высота баннера"></a>  
  </td>
<td width="17" background="http://apocalypse.ucoz.kz/border/5.png">
</td>
</tr>
<tr>
<td width="17" background="http://apocalypse.ucoz.kz/border/6.png" height="17">
</td>
<td background="http://apocalypse.ucoz.kz/border/7.png" height="17">
</td>
<td width="17" background="http://apocalypse.ucoz.kz/border/8.png" height="17">
</td>
</tr>
</tbody></table>  
  </li>  

</ul>  
  </div>  
  </center>


Как видно, код каждого баннера начинается с li и оканчивается на /li. Я специально разделил отступами весь код на отдельные участки.

На всякий случай скрипт прикреплён к материалу в архиве.

Всё, будьте внимательны и используйте с умом smile

Категория: jQuery | Добавил: Apocalypse | Теги: Apocalypse, друзья, блок, ucoz, by, на, JQuery, для, сайта
Просмотров: 297 | Загрузок: 0 | Рейтинг: 0.0/0
Всего комментариев: 0
Имя *:
Email: