вертикальная безпрерывная прокрутка (js)

S

skyman

Постоялец
Регистрация
20 Июн 2007
Сообщения
127
Реакции
24
Есть скрипт прокрутки.
Элементы перемещаются снизу вверх, а нужно наоборот, как реализовать?
Код: 
<script language="JavaScript">
function start() {
   new mq('m1');
   mqRotate(mqr); // must come last
}
window.onload = start;
function startstopchange(m,txt) {for (var j=m.length - 1; j > -1; j--) document.getElementById('ss'+m[j].id).value = txt;}  
function startstop(m,n) {var ss = document.createElement('form');var sd = document.createElement('div');ss.appendChild(sd);var sb = document.createElement('input');
}   
function objHeight(obj) {if(obj.offsetHeight) return  obj.offsetHeight; if (obj.clip) return obj.clip.height; return 0;} var mqr = []; function mq(id){this.mqo=document.getElementById(id); var ht = objHeight(this.mqo.getElementsByTagName('div')[0])+ 5; var fulht = objHeight(this.mqo); var txt = this.mqo.getElementsByTagName('div')[0].innerHTML; this.mqo.innerHTML = ''; var wid = this.mqo.style.width; this.mqo.onmouseout=function() {mqRotate(mqr);startstopchange(mqr,'STOP');}; this.mqo.onmouseover=function() {clearTimeout(mqr[0].TO); startstopchange(mqr,'START');}; this.mqo.ary=[]; var maxw = Math.ceil(fulht/ht)+1; for (var i=0;i < maxw;i++){this.mqo.ary[i]=document.createElement('div'); this.mqo.ary[i].innerHTML = txt; this.mqo.ary[i].style.position = 'absolute'; this.mqo.ary[i].style.top = (ht*i)+'px'; this.mqo.ary[i].style.height = ht+'px'; this.mqo.ary[i].style.width = wid; this.mqo.appendChild(this.mqo.ary[i]);} mqr.push(this.mqo);startstop(mqr,this.mqo);} function mqRotate(mqr){if (!mqr) return; for (var j=mqr.length - 1; j > -1; j--) {maxa = mqr[j].ary.length; for (var i=0;i<maxa;i++){var x = mqr[j].ary[i].style;  x.top=(parseInt(x.top,10)-1)+'px';} var y = mqr[j].ary[0].style; if (parseInt(y.top,10)+parseInt(y.height,10)<0) {var z = mqr[j].ary.shift(); z.style.top = (parseInt(z.style.top) + parseInt(z.style.height)*maxa) + 'px'; mqr[j].ary.push(z);}} mqr[0].TO=setTimeout('mqRotate(mqr)',30);}
</script>

<div id="m1" class="marquee" style="position:relative; overflow:hidden; width: 200px; height: 200px; border: 1px solid;">
<div id="marqueecontainer">
<p><a href="#">1</a></p>
<p><a href="#">2</a></p>
<p><a href="#">3</a></p>
<p><a href="#">4</a></p>
<p><a href="#">5</a></p>
<p><a href="#">6</a></p>
<p><a href="#">7</a></p>
<p><a href="#">8</a></p>
<p><a href="#">9</a></p>
<p><a href="#">10</a></p>
</div>
</div>
 
<script language="JavaScript">
function start() {
new mq('m1');
mqRotate(mqr); // must come last
}
window.onload = start;
function startstopchange(m,txt) {for (var j=0; j < m.length - 1; j++) document.getElementById('ss'+m[j].id).value = txt;}
function startstop(m,n) {var ss = document.createElement('form');var sd = document.createElement('div');ss.appendChild(sd);var sb = document.createElement('input');
}
function objHeight(obj) {if(obj.offsetHeight) return obj.offsetHeight; if (obj.clip) return obj.clip.height; return 0;} var mqr = []; function mq(id){this.mqo=document.getElementById(id); var ht = objHeight(this.mqo.getElementsByTagName('div')[0])+ 5; var fulht = objHeight(this.mqo); var txt = this.mqo.getElementsByTagName('div')[0].innerHTML; this.mqo.innerHTML = ''; var wid = this.mqo.style.width; this.mqo.onmouseout=function() {mqRotate(mqr);startstopchange(mqr,'STOP');}; this.mqo.onmouseover=function() {clearTimeout(mqr[0].TO); startstopchange(mqr,'START');}; this.mqo.ary=[]; var maxw = Math.ceil(fulht/ht)+1; for (var i=0;i < maxw;i++){this.mqo.ary=document.createElement('div'); this.mqo.ary.innerHTML = txt; this.mqo.ary.style.position = 'absolute'; this.mqo.ary.style.top = (ht*i)+'px'; this.mqo.ary.style.height = ht+'px'; this.mqo.ary.style.width = wid; this.mqo.appendChild(this.mqo.ary);} mqr.push(this.mqo);startstop(mqr,this.mqo);} function mqRotate(mqr){if (!mqr) return; for (var j=mqr.length - 1; j > -1; j--) {maxa = mqr[j].ary.length; for (var i=0;i<maxa;i++){var x = mqr[j].ary.style; x.top=(parseInt(x.top,10)-1)+'px';} var y = mqr[j].ary[0].style; if (parseInt(y.top,10)+parseInt(y.height,10)<0) {var z = mqr[j].ary.shift(); z.style.top = (parseInt(z.style.top) + parseInt(z.style.height)*maxa) + 'px'; mqr[j].ary.push(z);}} mqr[0].TO=setTimeout('mqRotate(mqr)',30);}
</script>
<div id="m1" class="marquee" style="position:relative; overflow:hidden; width: 200px; height: 200px; border: 1px solid;">
<div id="marqueecontainer">
<p><a href="#">1</a></p>
<p><a href="#">2</a></p>
<p><a href="#">3</a></p>
<p><a href="#">4</a></p>
<p><a href="#">5</a></p>
<p><a href="#">6</a></p>
<p><a href="#">7</a></p>
<p><a href="#">8</a></p>
<p><a href="#">9</a></p>
<p><a href="#">10</a></p>
</div>
</div>
Нажмите для раскрытия...

Вот так по-моему
 
Направление все равно не меняется
 
По идеи
Код: 
 x.top=(parseInt(x.top,10)-1)+'px';}

заменить на
Код: 
 x.top=(parseInt(x.top,10)+1)+'px';}

Не проверял, но вижу, что дальше логика рушиться.
Тебе нужно в раздел
Для просмотра ссылки Войди или Зарегистрируйся
там быстрее ответят.
 
Лови.

PHP: 
<script language="JavaScript">
function start() {
   new mq('m1');
   mqRotate(mqr); // must come last
}
window.onload = start;
function startstopchange(m,txt) {for (var j=m.length - 1; j > -1; j--) document.getElementById('ss'+m[j].id).value = txt;}  
function startstop(m,n) {var ss = document.createElement('form');var sd = document.createElement('div');ss.appendChild(sd);var sb = document.createElement('input');
}   
function objHeight(obj) {if(obj.offsetHeight) return  obj.offsetHeight; if (obj.clip) return obj.clip.height; return 0;} var mqr = []; function mq(id){this.mqo=document.getElementById(id); var ht = objHeight(this.mqo.getElementsByTagName('div')[0])+ 5; var fulht = objHeight(this.mqo); var txt = this.mqo.getElementsByTagName('div')[0].innerHTML; this.mqo.innerHTML = ''; var wid = this.mqo.style.width; this.mqo.onmouseout=function() {mqRotate(mqr);startstopchange(mqr,'STOP');}; this.mqo.onmouseover=function() {clearTimeout(mqr[0].TO); startstopchange(mqr,'START');}; this.mqo.ary=[]; var maxw = Math.ceil(fulht/ht)+1; for (var i=0;i < maxw;i++){this.mqo.ary[i]=document.createElement('div'); this.mqo.ary[i].innerHTML = txt; this.mqo.ary[i].style.position = 'absolute'; this.mqo.ary[i].style.bottom = (ht*i)+'px'; this.mqo.ary[i].style.height = ht+'px'; this.mqo.ary[i].style.width = wid; this.mqo.appendChild(this.mqo.ary[i]);} mqr.push(this.mqo);startstop(mqr,this.mqo);} function mqRotate(mqr){if (!mqr) return; for (var j=mqr.length - 1; j > -1; j--) {maxa = mqr[j].ary.length; for (var i=0;i<maxa;i++){var x = mqr[j].ary[i].style;  x.bottom=(parseInt(x.bottom,10)-1)+'px';} var y = mqr[j].ary[0].style; if (parseInt(y.bottom,10)+parseInt(y.height,10)<0) {var z = mqr[j].ary.shift(); z.style.bottom = (parseInt(z.style.bottom) + parseInt(z.style.height)*maxa) + 'px'; mqr[j].ary.push(z);}} mqr[0].TO=setTimeout('mqRotate(mqr)',30);}
</script>
<div id="m1" class="marquee" style="position:relative; overflow:hidden; width: 200px; height: 200px; border: 1px solid;">
<div id="marqueecontainer">
<p><a href="#">1</a></p>
<p><a href="#">2</a></p>
<p><a href="#">3</a></p>
<p><a href="#">4</a></p>
<p><a href="#">5</a></p>
<p><a href="#">6</a></p>
<p><a href="#">7</a></p>
<p><a href="#">8</a></p>
<p><a href="#">9</a></p>
<p><a href="#">10</a></p>
</div>
</div>
 
Войдите или зарегистрируйтесь для ответа.
Назад
Сверху