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

Автоматическое печатание текста через плагин jTicker на jQuery для uCoz
23.06.14, 14:18:52

Скачать файл




Неплохой плагин, который позволяет создавать вид автоматически печатающегося текста

Для начала посмотрите ДЕМО

Установка:

После /head на нужных страницах вставляйте:
Код
<style type="text/css" media="screen, projection">
#ticker  
{height: 12em; padding: 0.6em 0; margin: 0 0 1.8em 0; border-top:3px solid #efefef; border-bottom:3px solid #efefef; position: relative;}  
#ticker .cursor  
{display: inline-block; background: #565c61; width: 0.6em; height: 1em; text-align: center;}  
#ticker p  
{margin-bottom: 0.8em;}  
#ticker code  
{margin: 0.4em 0.4em; display: block;}  
#ticker .next
{position: absolute; bottom: 1em;}  
  </style>

  <script type="text/javascript" SRC="/js/jquery.jticker.js"></script>
  <script type="text/javascript">
  <!--  
jQuery(document).ready(function(){  
// Instantiate jTicker
jQuery("#ticker").ticker({  
cursorList: " ",  
rate: 20,  
delay: 6000  
}).trigger("play").trigger("stop");  

// Trigger events  

jQuery(".next").live("click", function(){  
jQuery("#ticker")  
.trigger({type: "play"})  
.trigger({type: "stop"});  
return false;  
});  

});  

  //-->  
  </script>


Немного разберём параметры:

rate: 20, - скорость печатания символов
delay: 6000 - задержка

Сам текст, который будет печататься, прописываем так:
Код
<div id="ticker">

  <div>
  <h3>Заголовок</h3>
   

Здесь любой ваш текст</p>
   

Следующая строчка текста</p>
  <a class="next" href="#">Далее</a>
  </div>

  <div>
  <h3>Следующий Заголовок</h3>
   

Здесь любой ваш текст №2</p>
   

Следующая строчка текста №2</p>
  <a class="next" href="#">Далее</a>
</div>

  </div>


Осталось лишь залить скрипт из прикреплённого архива в папку js

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