При прерывистой плавной прокрутке новостей на странице наиболее распространенным методом является копирование и добавление содержимого области прокрутки, а затем управление и оценка значения ScrollTop блока прокрутки для достижения эффекта остановки прокрутки.
Фактически, во многих случаях проще добиться прерывистой плавной прокрутки операций узла.
Код выглядит следующим образом:
<script Language="javascript" type="text/javascript">
window.onload=function(){
var o=document.getElementById('box');
window.setInterval(function(){scrollup(o,24,0);},3000);
}
///Прокрутка основного метода
///Параметр: o объект блока прокрутки
///Параметр: d Высота каждой прокрутки
///Параметр: c текущая высота прокрутки
функция прокрутки(o,d,c){
если (д == с) {
вар т = getFirstChild (o.firstChild).cloneNode (истина);
o.removeChild(getFirstChild(o.firstChild));
о.appendChild(т);
t.style.marginTop="0px";
}еще{
с+=2;
getFirstChild(o.firstChild).style.marginTop=-c+"px";
window.setTimeout(function(){scrollup(o,d,c)},20);
}
}
//Решаем проблему, связанную с тем, что пробелы и возвраты каретки будут использоваться в качестве узлов в Firefox
функция getFirstChild(узел){
пока (node.nodeType!=1)
{
узел = node.nextSibling;
}
возвратный узел;
}
</скрипт>
<ul id="box">
<li>· Xinhua Daily Telegraph: Плата за авторские права на музыку подобна «комку конопли» </li>
<li>· Современный экспресс: могут ли люди жениться на роботах и иметь детей </li>
<li>·В мире: Америка – банкротство клуба миллиардеров.</li>
<li>· Современный экспресс: Чтобы заставить Ни Чжэня замолчать от средств массовой информации, он хотел продать любовные письма Ли Цзясинь.</li>
<li>· Beijing Times: Самодельная ракета студентов Пекинского университета аэронавтики и астронавтики поднимается в небо</li>
</ul>
Эффект:
запустить код
<style type="text/css">
<!--
* { поле: 0 пикселей; дополнение: 0 пикселей;}
#box {ширина: 300 пикселей; высота: 24 пикселей; переполнение: скрытый; размер шрифта: 12 пикселей; фон: # efef;}
#box li {стиль списка: нет; высота строки: 24 пикселя;}
-->
</стиль>
<script Language="javascript" type="text/javascript">
window.onload=function(){
var o=document.getElementById('box');
window.setInterval(function(){scrollup(o,24,0);},3000);
}
функция прокрутки(o,d,c){
если (д == с) {
вар т = getFirstChild (o.firstChild).cloneNode (истина);
o.removeChild(getFirstChild(o.firstChild));
о.appendChild(т);
t.style.marginTop="0px";
}еще{
с+=2;
getFirstChild(o.firstChild).style.marginTop=-c+"px";
window.setTimeout(function(){scrollup(o,d,c)},20);
}
}
функция getFirstChild(узел){
пока (node.nodeType!=1)
{
узел = node.nextSibling;
}
возвратный узел;
}
</скрипт>
<ul id="box">
<li>· Xinhua Daily Telegraph: Плата за авторские права на музыку подобна «комку конопли» </li>
<li>· Современный экспресс: могут ли люди жениться на роботах и иметь детей? </li>
<li>·В мире: Америка – банкротство клуба миллиардеров.</li>
<li>· Современный экспресс: Чтобы заставить Ни Чжэня замолчать от средств массовой информации, он хотел продать любовные письма Ли Цзясинь.</li>
<li>· Beijing Times: Самодельная ракета студентов Пекинского университета аэронавтики и астронавтики поднимается в небо</li>
</ul>