Gepost door joost
op 31 mei 2010 in de categorie
HTML
Een pagina automatisch laten scrollen met javascript... Klinkt niet moeilijk... maar is het ook simpel? Laten we eens kijken.
Ik vond het onderstaande voorbeeld op een website. Er staan 3 getallen in deze code. De eerste (de 2) is het aantal pixels dat de pagina per tijdseenheid naar rechts gaat. De tweede (de 0) is het aantal pixels dat de pagina per tijdseenheid naar beneden gaat. De derde en laatste (de 10) is de lengte van de tijdseenheid in milliseconden. Een langere tijdseenheid zorgt voor een tragere scroll en een lichter script. Hoe korter je de scrollafstand maakt hoe trager en geleidelijker het scrollen zal gaan. Bij een typische toepassing zul je onmouseover de pagescroll functie aanroepen en onmouseout de stopScroll functie. Je laat de pagina dan automatisch scrollen als je met je cursor op het gekozen object staat. Simpel en elegant.
<script type="text/javascript">
function pageScroll() {
window.scrollBy(2,0); // horizontal (2px) and vertical (0px) scroll increments
scrolldelay = setTimeout('pageScroll()',10); // scrolls every 10 milliseconds
}
function stopScroll() {
clearTimeout(scrolldelay);
}
</script>