PDA

Zobacz pełną wersję : własny scroll w artykule



templer00
31-03-2011, 21:26
Witam,
chciałbym dodać do artykułu własny scroll oparty na javascript jednak coś nie wychodzi.
poza tym ze strzalki wyskakuja mi poza obszar strony (na dole zamiast po prawej stronie) , ale to pewnie kwestia moich blędów w css i jakoś to wyprowadze. Ale ważniejsze jest to iż skrypt nie działa. Strzałki na które powinny przeijac tekst po najechaniu kursorem nie przewijają tkstu. Czy błędnie umieściłem skrypt?, może powinienem jakiś dodatek zainstalować... nie mam już pomyslu...

Kod który wpisuje w dany artykuł:

<div id="podstrona_zawartosc">
<p>tresc artykulu</p>
</div>
<div id="center_scroll">
<div style="height: 378px; overflow: hidden;"><a id="podstrona_arrow_up" href="#" title="przewin w góre" onclick="return false;"> <img src="images/stories/moje/arrowup.gif" border="0" alt="top" /></a></div>
<a id="podstrona_arrow_down" href="#" title="przewin w dól" onclick="return false;"> <img src="images/stories/moje/arrowdown.gif" border="0" alt="bottom" /></a></div>

CSS do tych div'ów:

#podstrona_zawartosc { width:879px; height:420px; overflow: hidden; z-index:1}
#center_scroll { padding-top:60px; float:left; padding-left:20px; width:20px; height:400px; overflow:hidden; display:none;}


w index.php:
<script type="text/javascript" src="/strona/media/system/js/scroll.js"></script>
(skrypt oczywiscie dodany do folderu ww scieżki)

i sam scrypt "scroll.js":

scrollStep=3;
scrollTime=35;

timerLeft=0;
timerRight=0;


function move_up()
{
clearTimeout(timerRight);
document.getElementById('podstrona_zawartosc').scr ollTop+=scrollStep;
timerRight=setTimeout("move_up('podstrona_zawartosc')",scrollTime);
}

function move_down()
{
clearTimeout(timerLeft);
document.getElementById('podstrona_zawartosc').scr ollTop-=scrollStep;
timerLeft=setTimeout("move_down('podstrona_zawartosc')",scrollTime);
}


function stopMe()
{
clearTimeout(timerRight);
clearTimeout(timerLeft);
}

if (window.addEventListener) {
window.addEventListener("load",initScroll,false);
} else if (window.attachEvent) {
window.attachEvent("onload",initScroll);
} else {
window.onload = function() {initScroll();}
}
function initScroll() {
if(document.getElementById('podstrona_zawartosc'). scrollHeight>420)
{
//alert('potrzeba');
document.getElementById('center_scroll').style.dis play='block';
}
}

Dziękuje za wszelkie podpowiedzi..

larry_krk
31-03-2011, 23:13
Otwórz sobie np. na http://demo.getk2.org/en/blog-entry i podejrzyj jak jest zrobione przewijanie w dowolne miejsce na stronie. Na tej stronie z wykorzystaniem mootools (wideo, galeria, a na dole "do góry") . W razie potrzeby, w googlu wpisz "scroll page jquery" i będziesz miał gotowca w jquery.