Javascript-форум (https://javascript.ru/forum/)
-   jQuery (https://javascript.ru/forum/jquery/)
-   -   Вопрос по бегущей строке для изображений (https://javascript.ru/forum/jquery/17390-vopros-po-begushhejj-stroke-dlya-izobrazhenijj.html)

0931454574 17.05.2011 17:42

Вопрос по бегущей строке для изображений
 
Возможно у кого нибудь была задача в реализации бегущей строки из изображений. Самому писать нет времени , а вот гугл выдает чепуху непригодную, непригодность заключается в разрыве между последним изображением и первым . Возможно есть пример искомого . Хотя уже склоняюсь к самостоятельному написанию.
Меня вот что заботит, тот момент когда нужно добавлять изображение в движуйсийся блок?
например движется блок с 2мя изображениями в блоке (окне). Я так понимаю что добавлят по координатом отпадает в виду невозможности установить их точно (+-2 px даже при интервале в 1 мс). Наверное в блок лучше добавлять просто новое изображение ,а уже в стиле блока прописать флоат и все будет выстраиваться. Возможно есть более простой вариант?

Sweet 17.05.2011 17:52

<marquee>
  <img src="http://javascript.ru/forum/images/ca_serenity/misc/logo.gif">
</marquee>

Aetae 17.05.2011 19:08

Ну marquee не валиден. Если упрощенно и универсально то как-то так
:
<style type="text/css">
div#marquee img{vertical-align:top}
div#marquee span{font-size:0} 
div#marquee {
border:1px solid #000;
overflow:hidden;
white-space:nowrap;
height:70px;}
</style>
<div id="marquee">
  <span>
    <img src="http://javascript.ru/forum/images/ca_serenity/misc/logo.gif">
    <img src="http://javascript.ru/forum/image.php?u=12257&dateline=1304687820">
  </span>
</div>

<script type="text/javascript">
(function(step,speed){
var e=document.getElementById('marquee');
var e_width=e.offsetWidth;
var span=e.getElementsByTagName('span')[0];
var width=span.offsetWidth;
var margin=0;
while(e.scrollWidth<(e_width+width))e.appendChild(span.cloneNode(true))
step||(step=10);
speed||(speed=50);
(function(){
	margin+=width>=-margin?-step:width;
	span.style.marginLeft=margin+'px';
	setTimeout(arguments.callee,speed)
})()
})(5,50)
</script>

0931454574 17.05.2011 20:11

Aetae,
Спасибо товарищ. Вот это да. Обалдеть. Я и не думал что так моя физиономия сочитается с красным ))Шутка. А вообще спасибо. Отлично.

Если можно, то обьясните словами как он работает. А то у меня получается не совсем ясная картина. Большое спасибо.

AniStark 19.11.2012 18:55

Цитата:

Сообщение от Aetae (Сообщение 105134)
Ну marquee не валиден. Если упрощенно и универсально то как-то так:

Только почему-то в хроме не работает.

yurik417 26.01.2013 04:52

Вот бегущая строка с изображениями http://masscode.ru/index.php/k2/item/44-limarquee

Сергей77731 25.11.2013 20:17

410 руб.модуль красный
 
410 РУБЛЕЙ МОДУЛЬ КРАСНЫЙ 160*320
620 РУБЛЕЙ МОДУЛЬ БЕЛЫЙ РАЗМЕР 160*320
МОДУЛИ И КОМПЛЕКТУЮЩИЕ ДЛЯ БЕГУЩИХ СТРОК
Тел 89089030994 почта Sales@futuread.ru


Часовой пояс GMT +3, время: 21:27.