Последняя новость, исчезает благодаря jQuery 2128 | (13) Сегодня мы будем создавать небольшой контейнер div, в котором будет размещаться последняя новость вашего сайта, но она будет не просто отображаться, а исчезать и заменять себя другой новостью, этакая карусель новостей так сказать, давайте взглянем на Демо и всё поймём без лишнего описания...

Установка
Шаг-1 JS:
Следует установить на странице сайта, после тега body, следующие скрипты:

Код
<script type="text/javascript" src="jquery.newsticker.js"></script>  
<script type="text/javascript">  
$(document).ready(  
  function()  
  {  
  $("#news").newsTicker();  
  parseSamples();  
  }  
);  
</script>


Шаг-2 Html:
Заходим в админ панель => Инструменты Информеры => Создать информер

Раздел: новости
Тип данных: материалы
Способ сортировки: рейтинг материала
Количество материалов: 5
Код
Количество колонок:
1

и устанавливаем в него следующий код:

Код
<li><a href="$ENTRY_URL$">$TITLE$</a></li>


и устанавливаем в нужное место страницы информер:

Код
<ul id="news">  
  $MYINF_1$  
</ul>


Шаг-3 Css:
Устанавливаем css стили, в которых пропишем основные атрибуты, рамку, фон, ширину контейнера и внутренний отступ.

Код
.newsticker {  
  font:12px Verdana,Arial,Helvetica, sans-serif;  
  font-weight: bold;  
  text-shadow: 1px 1px 1px #fff;  
  list-style-type: none;  
  outline: 1px solid #D0D0D0;  
  border:1px solid #fff;  
  width:300px;  
  background: #F4F5F6;  
  padding: 5px;  
  margin: 0;  
}

Всё теперь у нас установлен контейнер с последней новостью на сайте.



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