Dhtml - Scroller di testo da mouse

Scroller di testo da mouse

Ottima demo che genera una finestra indipendente all'interno del documento. Tale finestra può contenere immagini e testo e viene scrollata semplicemente passando il puntatore del mouse su immagini esterne alla stessa. Un altro pulsante permette di ritornare al punto superiore della finestra. Da provare.

il codice da inserire nella tua pagina

<HTML> <HEAD> <SCRIPT> function tmt_scrollLayerBy(bersaglio, dx, dy, vel) { if (document.layers) { turi = document.layers[bersaglio]; var cl = turi.clip.left; var ct = turi.clip.top; var cr = turi.clip.right; var cb = turi.clip.bottom; var l = turi.left; var t = turi.top; turi.clip.left = cl + dx; turi.clip.top = ct + dy; turi.clip.right = cr + dx; turi.clip.bottom = cb + dy; turi.top = t - dy; turi.left = l - dx; } else { if (document.all) { turi = eval("document.all." + bersaglio + ".style"); if (turi.clip) { var clipv = turi.clip.split("rect(")[1].split(")")[0].split("px"); var ct = Number(clipv[0]); var cr = Number(clipv[1]); var cb = Number(clipv[2]); var cl = Number(clipv[3]); var l = turi.pixelLeft; var t = turi.pixelTop; } ncl = cl + dx; nct = ct + dy; ncr = cr + dx; ncb = cb + dy; turi.pixelTop = t - dy; turi.pixelLeft = l - dx; eval("turi.clip = 'rect(' + nct + ' ' + ncr + ' ' + ncb + ' ' + ncl +')'"); } } tmt_scrollalo = setTimeout("tmt_scrollLayerBy('" + bersaglio + "'," + dx + "," + dy + "," + vel + ")", vel); } function tmt_stopScroll() { if (tmt_scrollalo) { clearTimeout(tmt_scrollalo); } } if (document.layers) { origWidth = innerWidth; origHeight = innerHeight;} function reDo() { if (innerWidth != origWidth || innerHeight != origHeight) location.reload();} if (document.layers) onresize = reDo; </SCRIPT> </HEAD> <BODY bgcolor="white" > <div id="scroller" style="position:absolute; width:50px; left: 130px; top: 160px"> <div align="center"> <a href="#" onMouseOver="tmt_scrollLayerBy('scrollo',0,3,5)" onMouseOut="tmt_stopScroll()"><img name="up" src="http://digilander.libero.it/Centox100/Sito/Immagini/up.gif" border="0" alt="Su"></a> <a href="#" onClick="location.reload()"><img name="block" src="http://digilander.libero.it/Centox100/Sito/Immagini/block.gif" alt="Inizio" border="0" vspace=12></a> <a href="#" onMouseOver="tmt_scrollLayerBy('scrollo',0,-3,5)" onMouseOut="tmt_stopScroll()"><img name="down" src="http://digilander.libero.it/Centox100/Sito/Immagini/down.gif" border="0" alt="Giù"></a> </div> </div> <div id="scrollo" style="position:absolute; width:320px; height:200px; left: 280px; top: 150px; clip: rect(0 300 150 0)"> 100%<BR> 100%<BR> 100%<BR> 100%<BR> 100%<BR> 100%<BR> 100%<BR> 100%<BR> 100%<BR> 100%<BR> 100%<BR> 100%<BR> 100%<BR> 100%<BR> </div> </body> </html>

100%
100%
100%
100%
100%
100%
100%
100%
100%
100%
100%
100%

E' vietata la riproduzione anche solo parziale di immagini, icone, layout e contenuti senza previa autorizzazione.
I marchi, i loghi e i prodotti citati sono dei legittimi proprietari.