[HTML] div a scorrimento

max246 · 09-01-2007, 09:21

Allora voglio fare uno spazio, preferisco con i div, dove scorre un testo e si può scorrere manualmente, tipo gli iframe!

Avete qualche consiglio? Aiuto? Altro?

andbin · 09-01-2007, 09:59

Quote:

Originariamente inviato da max246

Allora voglio fare uno spazio, preferisco con i div, dove scorre un testo e si può scorrere manualmente, tipo gli iframe!

A livello di CSS imposta overflow:auto.

Esempio:

Codice:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>Prova div</title>
<style type="text/css">
<!--
div.scrolling { width:100px; height:50px; overflow:auto; border:1px solid #808080; }
-->
</style>
</head>
<body>

<div class="scrolling">
Prova<br>Prova<br>Prova<br>Prova<br>Prova<br>
Prova<br>Prova<br>Prova<br>Prova<br>Prova<br>
</div>

</body>
</html>

max246 · 09-01-2007, 10:10

ok, c'è un sistema con JS per fare lo scroll automatico? Perchè mi serve come informazioni da scorrere altrimenti si può scrollare manualmente...

andbin · 09-01-2007, 10:52

Quote:

Originariamente inviato da max246

ok, c'è un sistema con JS per fare lo scroll automatico? Perchè mi serve come informazioni da scorrere altrimenti si può scrollare manualmente...

Ah, ok ... dalla tua richiesta iniziale non si capiva che volevi uno scrolling automatico (tipo quello di certi siti di e-commerce o di informazione, giusto?).
Comunque si può fare sicuramente. Appena ho un attimo di tempo faccio qualche prova.

andbin · 09-01-2007, 11:09

Prova questo:

Codice:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>Prova scrolling automatico</title>
<script type="text/javascript">
<!--
var scroll_enable = true;
var scroll_move = 2;
var scroll_time = 100;

function scroll_update ()
{
    var obj = document.getElementById ("testo");

    if (scroll_enable)
    {
        if ((obj.scrollTop + scroll_move) < (obj.scrollHeight - obj.clientHeight))
            obj.scrollTop += scroll_move;
        else
            obj.scrollTop = 0;
    }

    setTimeout (scroll_update, scroll_time);
}
//-->
</script>
<style type="text/css">
<!--
div.scrolling { width:100px; height:80px; overflow:auto; border:1px solid #808080; }
div.pad { margin-top:80px; margin-bottom:80px; }
-->
</style>
</head>
<body onload="scroll_update()">

<div class="scrolling" id="testo" onmouseover="scroll_enable=false" onmouseout="scroll_enable=true">
<div class="pad">
Riga 1<br>Riga 2<br>Riga 3<br>Riga 4<br>Riga 5<br>Riga 6<br>
Riga 7<br>Riga 8<br>Riga 9<br>Riga 10<br>Riga 11<br>Riga 12<br>
</div>
</div>

</body>
</html>

Nota due cose: ho fatto in modo che se ci passi sopra con il mouse, lo scrolling si arresta (su altri siti fanno così, almeno). Se non vuoi far vedere la scrollbar, basta mettere overflow:hidden.
Testato con FF2 e IE6.

Dimmi se ti va bene ... comunque puoi modificarlo come ti pare per quanto riguarda posizioni, velocità, ecc...

max246 · 10-01-2007, 10:48

thx dopo provo

09-01-2007, 09:21	#1
max246 Senior Member Iscritto dal: May 2005 Messaggi: 340	[HTML] div a scorrimento Allora voglio fare uno spazio, preferisco con i div, dove scorre un testo e si può scorrere manualmente, tipo gli iframe! Avete qualche consiglio? Aiuto? Altro?

09-01-2007, 10:10	#3
max246 Senior Member Iscritto dal: May 2005 Messaggi: 340	ok, c'è un sistema con JS per fare lo scroll automatico? Perchè mi serve come informazioni da scorrere altrimenti si può scrollare manualmente...

10-01-2007, 10:48	#6
max246 Senior Member Iscritto dal: May 2005 Messaggi: 340	thx dopo provo

Strumenti
Mostra una versione stampabile Invia questa pagina per email