Бегущая строка зафиксированная в нижней части сайта - Скрипты для uCoz | Делай сайт
Приветствую Вас, Гость! Регистрация
Георгиевская ленточка
Воскресенье, 11.12.2016
Скрипты для uCoz » Скрипты для юКоз » Бегущая строка зафиксированная в нижней части сайта

Аудиоплеер для сайта uCozАудиоплеер с плейлистом для сайта
Видеоплеер для сайта uCozВидеоплеер с плейлистом для сайта
Меню для сайта uCozВертикальное меню для сайта uCoz
Выпадающее меню для сайта uCozГоризонтальное меню для сайта uCoz
Круглое меню для сайта uCozВид материалов для сайта uCoz
Вид материалов Аудио для uCozВид материалов Видео для uCoz
Галерея для сайта uCozГенераторы для сайта uCoz
Контейнер для контентаКнопки для сайта uCoz
Слайдер для сайта uCozСчётчик для сайта uCoz
Часы для сайта uCozТекстовые эффекты
Таблица цветов для сайта uCozЭффекты для сайта uCoz
Эффекты курсораЭффекты увеличения
Мини чат для сайта uCozРадио для сайта uCoz
Скрипты для юКозИгры для сайта uCoz
Окна для сайта uCozИнформеры для сайта uCoz
Флеш и анимации для сайтаКалендарь для сайта uCoz
Мониторинг серверов для ucozСлайдшоу для сайта uCoz



Адаптивный сайт - aTmpl



Бегущая строка зафиксированная в нижней части сайта

Скрипт бегущей строки прижатой к нижней части страницы сайта




Бегущая строка с выводимой текстовой информацией дополненной ссылками будет зафиксирована в нижней части Вашего сайта и не будет прокручиваться при скроллинге. Все параметры бегущей строки доступны для внесения изменений, имеется в виду, содержимое, размеры и цвета. Скрипт бегущей строки полностью оптимизирован для установки на сайтах системы uCoz и будет работать даже при помещении в редактор материала (как на этой странице). Это говорит о том что каждая отдельная страница с материалом может иметь свою собственную бегущую строку. Скрипт будет работать при подключенной библиотеке jQuery, на сайтах юКоза она есть по умолчанию. При возникновении технических вопросов используйте эту форму комментариев
Для всех остальных можете применять комментарии ВКонтакте.





Скрипт для установки бегущей строки на сайт


<style>
#ds-marquee {
height: 23px;
line-height: 20px;
font-size:14px;
margin:-3px 5px 10px 5px;
overflow:hidden;
}
#ds-marquee b,
#ds-marquee-footer b {
margin:25px 12px 0 7px;
line-height:22px;
color:#fff;
float:left
}
#ds-marquee-footer {
position:fixed;
bottom:0;
left:0;
height: 23px;
line-height: 20px;
width:100%;
background-color:green;
margin:0;
overflow:hidden;
z-index:20;
}
#ds-marquee-footer,
#ds-marquee-footer span a,
#ds-marquee-footer span.ds-marquee-info {color:red;font-size:14px;}
#ds-marquee-footer span.title > a {color:white;font-size:12px;}
#ds-marquee-footer span a {text-decoration:none;}
#ds-marquee-footer span a:hover {text-decoration:underline;}
#ds-marquee-footer .marquee0 div {margin:0 auto;}
#ds-marquee-footer-shift {
margin:0;
padding:0;
border:0;
height:28px;
width:0;
}
#ds-marquee-textup-footer {margin-top:5px;}
#ds-marquee-position {position:relative;}
</style>
<div id="ds-marquee-footer">
<div id="ds-marquee-textup-footer">
<span class="ds-marquee-info">Меренков Михаил<sup>&copy;</sup></span>
<span class="title">
<a href="#" >Сижу и пишу о бегущей строке, на Русском пишу, на родном языке.</a>
</span>
&nbsp;&nbsp;&nbsp;
<span class="ds-marquee-info">Меренков Михаил<sup>&copy;</sup></span>
<span class="title">
<a href="#" >И пусть мне будет тяжело, но я не сдамся всем чертям на зло.</a>
</span>
&nbsp;&nbsp;&nbsp;
<span class="ds-marquee-info">Меренков Михаил<sup>&copy;</sup></span>
<span class="title">
<a href="#" >Не тот богат кто о себе мечтает, а тот кто слабым помогает.</a>
</span>
&nbsp;&nbsp;&nbsp;
<span class="ds-marquee-info">Меренков Михаил<sup>&copy;</sup></span>
<span class="title">
<a href="#" >Не получается, не злись. Все начинали, соберись.</a>
</span>
</div>
</div>
<script src="http://delaisait.ucoz.ru/script/effect/marquee/crawler.js" type="text/javascript"></script>
<script type="text/javascript">
if ( !($.browser.msie && parseInt($.browser.version, 10) == 6)) {
$(document).ready(function() {
marqueeInit({
style: {
"height":"23px"
},
uniqueid: "ds-marquee-textup-footer",
mouse: "cursor driven",
moveatleast: 2,
savedirection: true,
neutral: 150
});
}); }
</script>



Скрипт для проверки и настройки в редакторе

В этом демонстративном коде установлена библиотека jQuery, он нужен только для проверки которую Вы захотите произвести.



<script type="text/javascript" src="http://s36.ucoz.net/src/jquery-1.7.2.js">
</script>
<style>
#ds-marquee {
height: 23px;
line-height: 20px;
font-size:14px;
margin:-3px 5px 10px 5px;
overflow:hidden;
}
#ds-marquee b,
#ds-marquee-footer b {
margin:25px 12px 0 7px;
line-height:22px;
color:#fff;
float:left
}
#ds-marquee-footer {
position:fixed;
bottom:0;
left:0;
height: 23px;
line-height: 20px;
width:100%;
background-color:green;
margin:0;
overflow:hidden;
z-index:20;
}
#ds-marquee-footer,
#ds-marquee-footer span a,
#ds-marquee-footer span.ds-marquee-info {color:red;font-size:14px;}
#ds-marquee-footer span.title > a {color:white;font-size:12px;}
#ds-marquee-footer span a {text-decoration:none;}
#ds-marquee-footer span a:hover {text-decoration:underline;}
#ds-marquee-footer .marquee0 div {margin:0 auto;}
#ds-marquee-footer-shift {
margin:0;
padding:0;
border:0;
height:28px;
width:0;
}
#ds-marquee-textup-footer {margin-top:5px;}
#ds-marquee-position {position:relative;}
</style>
<div id="ds-marquee-footer">
<div id="ds-marquee-textup-footer">
<span class="ds-marquee-info">Меренков Михаил<sup>&copy;</sup></span>
<span class="title">
<a href="#" >Сижу и пишу о бегущей строке, на Русском пишу, на родном языке.</a>
</span>
&nbsp;&nbsp;&nbsp;
<span class="ds-marquee-info">Меренков Михаил<sup>&copy;</sup></span>
<span class="title">
<a href="#" >И пусть мне будет тяжело, но я не сдамся всем чертям на зло.</a>
</span>
&nbsp;&nbsp;&nbsp;
<span class="ds-marquee-info">Меренков Михаил<sup>&copy;</sup></span>
<span class="title">
<a href="#" >Не тот богат кто о себе мечтает, а тот кто слабым помогает.</a>
</span>
&nbsp;&nbsp;&nbsp;
<span class="ds-marquee-info">Меренков Михаил<sup>&copy;</sup></span>
<span class="title">
<a href="#" >Не получается, не злись. Все начинали, соберись.</a>
</span>
</div>
</div>
<script src="http://delaisait.ucoz.ru/script/effect/marquee/crawler.js" type="text/javascript"></script>
<script type="text/javascript">
if ( !($.browser.msie && parseInt($.browser.version, 10) == 6)) {
$(document).ready(function() {
marqueeInit({
style: {
"height":"23px"
},
uniqueid: "ds-marquee-textup-footer",
mouse: "cursor driven",
moveatleast: 2,
savedirection: true,
neutral: 150
});
}); }
</script>



Проверьте здесь скрипт бегущей строки

Скопируйте код из примера для проверки в редактор HTML и посмотрите результат.









Русские шрифты



Ссылка:
BB code:




  • ©
  • | Просмотров: 2298 | Добавил: IZOTOP | Рейтинг: 0.0/0
    | Теги: creeping line, running line, бегущая строка, scrolling text, Crawl

    Всего комментариев: 1
    0   Спам
    1 Zemiel   (21.09.2014 21:38)
    Аватар Zemiel Подскажите как вставить активную ссылку в бегущую строку. Желательно название с переходом на ссылку?


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