» »

Новостная лента на сайт форма бегущей строка


Новостная лента на сайт форма бегущей строка

Это что то вроде новостной ленты, которая будет реализована в бегущею строку. Разработан на новостной ресурс, но а также где нужно выставить, чтоб могли видит его. Так хорошо подойдет для того, чтоб выставить на время на свой сайт и написать, чтоб пользователь или гость знал. Это может быть любой информацией, как конкурсы и что то вроде того, что качается самого интернет портала.

Естественно, что эту бегущую строку можно поставить на любой сайт, для новостной ленты или текстового рекламного блока.
Установить бегущую строку на сайт достаточно просто

Для этого вам нужно:

1. Скачать архив с бегущей строкой

2. Залить содержимое в корень вашего сайта

3. Вставить этот код между <head> и </head>:

Код

<link href="styles/style.css" rel="stylesheet" type="text/css" />
<link href="styles/ticker-style.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.0/jquery.min.js"></script>
<script src="includes/jquery.ticker.js" type="text/javascript"></script>
<script src="includes/site.js" type="text/javascript"></script>


Тем самым, вы подключили css-стили и файлы js. необходимые для работы бегущей строки,ссылки меняйте на свои.

4. Вставить сам html код бегущей строки туда, где вы ее хотите видеть:
Код

<ul id="js-news" class="js-hidden">
<li class="news-item">jQuery News Ticker now has support for multiple tickers per page!</li>
<li class="news-item">jQuery News Ticker now has support for right-to-left languages!</li>
<li class="news-item">jQuery News Ticker now has support for loading content via an RSS feed!</li>
<li class="news-item">jQuery News Ticker now has an optional fade effect between items!</li>
<li class="news-item">New updates have been made to jQuery News Ticker! Check below for more details!</li>
<li class="news-item">jQuery News Ticker is now compatible with jQuery 1.3.2! See below for further details and for latest download.</li>
<li class="news-item">Further updates to jQuery News Ticker are coming soon!</li>
</ul>


Бегущая строка готова к использованию. Демо
Источник http://bayguzin.ru
04.02.2016 Загрузок: 3 Просмотров: 766 Комментарий: (5)

Поделиться в социальных сетях

Материал разместил

Комментарий: 4
Сопрано
Сопрано 04.02.2016 21:111
0
Костен, убирай этот материал, зачем тебе, ты сам пишешь, а здесь все скопировано.
Kosten
Kosten 04.02.2016 21:222
0
Trantel, потом перепишу, да скопированное мне не нужно, это точно.
Сафрон
Сафрон 04.02.2016 23:363
0
Но зачем такие сложности, есть скрипт бегущая строка.
csretven
csretven 04.02.2016 23:424
0
Но здесь как то по салидней смотрится и совершенно по другому выводить будет.
avatar