Home + Webmaster + Script + Javascript + Finestre e Frame + Scroller di testo al passaggio del mouse

Scroller di testo al passaggio del mouse

Il Javascript consente di creare uno scrolling con il semplice passaggio del mouse.

<html>
<head>
<title>Scroller di testo al passaggio del mouse</title>
<SCRIPT>
function tmtZ_clipBottom(bersaglio, clipbottom) {
    if (document.layers) {
        var Hzob = self.innerHeight / 100;
        document.layers[bersaglio].clip.bottom = clipbottom * Hzob;
    }
    if (document.all) {
        var Hzob = document.body.offsetHeight / 100;
        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 cl = Number(clipv[3]);
        }
        eval("turi.clip = 'rect(' + ct + ' ' +  cr + ' ' + clipbottom*Hzob + ' ' + cl +')'");
    }
}
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>
<div id="scroller" style="position:absolute; width:50px; left: 540px; top: 30px"> 
<div align="center">
<a href="#" onMouseOver="tmt_scrollLayerBy('scrollo',0,3,5)" onMouseOut="tmt_stopScroll()"><img name="scroller01" src="scroller01.gif" border="0" alt="Su"></a><br><br><br><br><br><br><br>
<a href="#" onClick="location.reload()"><img name="scroller02" src="scroller02.gif" alt="Inizio" border="0" vspace=12></a><br><br><br><br><br><br><br>
<a href="#" onMouseOver="tmt_scrollLayerBy('scrollo',0,-3,5)" onMouseOut="tmt_stopScroll()"><img name="scroller03" src="scroller03.gif" border="0" alt="Giù"></a>
</div>
</div>
<div id="scrollo" style="position:absolute; width:500px; height:400px; left: 20px; top: 20px; clip: rect(0 500 400 0)"> 
testo tetso testo
</body>
</html>

Salva queste immagini con il tasto destro del mouse o crea le tue immagini perssonalizzate.

Compatibilità: MsIE | Netscape

Javascript

Altre risorse:
Libri Javascript | Manuale Javascript

Motori di ricerca & Marketing Indispensabile a chiunque voglia imparare lo splendido lavoro del Web Marketer!

Webmaster Avanzato Percorso completo volto a formare dei professionisti del Web. Come si lavora in uno Staff?

Linux Guida al sistema operativo open-source, completamente gratuito e potente.

Fai fruttare il tuo sito! Diventa oggi stesso un affiliato Trade Doubler e guadagna qualche soldino con il tuo sito web.