scroll div ultima riga immessa

**pietro09** · 07-02-2006, 13:28

ho una tabella dentro un div a dimension fissa che può scorrere.

man mano che aggiungo righe alla tabella, vorrei che il div scorresse in modo da visualizzare l'ultima inserita.

Mi aiutata a ricordare come si fa? :master:

**Xinod** · 08-02-2006, 02:09

lo scrollTop, se non erro, e' proprieta' accessibile in lettura e scrittura

se scrolli ad un numero impossibile di px si fermera' alla fine
document.getElementById('id_div').scrollTop=100000 0;
altrimenti rileva l' altezza della tabella, che con buona approssimazione e'
document.getElementById('id_tabella').offsetHeight
e setta lo scrollTop a quel valore

ciaooo

**pietro09** · 08-02-2006, 09:12

Ringrazio. Il mio problema è che ho sì tutte le vostre risposte archiviate, ma non so più come trovarle

Ho provato così e sembra funzionare

codice:

//scrool ultima riga
var dv = document.getElementById("cornice_vertici");
dv.scrollTop = dv.offsetTop;

ciao

**pietro09** · 08-02-2006, 10:15

il codice che ho scritto funziona SOLO se dentro il div c'è una tabella, e va con IE, Firefox ed Opera.
Però ho trovato un vecchio post dove, se dentro il div c'è una serie di <p id="p_0">0</p>, quel codice non funziona più

**Xinod** · 08-02-2006, 13:02

cosa succede scrivendo
dv.scrollTop=vx.offsetTop;
dove
vx=document.getElementById("p_x");
?

**pietro09** · 08-02-2006, 13:23

scusa se rispondo tardi.

Ho questa pagina di prova. Ho due div. Quello in basso ha una tabella, ed il codice 'scrolla fino all'ultima riga, funziona con IE, Firefox ed Opera

Nel div superiore ci sono invece una serie di

xxx</p>. Non funziona bene con Firefox lo scroll all'id7

codice:

<%@ Language=VBScript %>
<HTML>
<HEAD>
<META NAME="GENERATOR" Content="Microsoft Visual Studio 6.0">
<SCRIPT ID=clientEventHandlersJS LANGUAGE=javascript>
<!--

//scroll elemento 7
function button1_onclick() 
{
	var y = document.getElementById("p_7").offsetTop;
	document.getElementById("div_1").scrollTop = y;
}


//scroll ultimo elemento
function button2_onclick() 
{
	//scrool ultima riga
	var dv = document.getElementById("div_1");
	var y = document.getElementById("p_17").offsetTop;
	
	dv.scrollTop = y;//dv.offsetTop;	
}

//scroll ultimo elemento
function button3_onclick() 
{
	//scrool ultima riga
	var dv = document.getElementById("div_2");
	//var y = document.getElementById("p_17").offsetTop;
	
	dv.scrollTop = dv.offsetTop;	
}


//-->
</SCRIPT>
</HEAD>
<BODY>

<div id="div_1" style="height:100px;width:100px;background:yellow;overflow:auto;">
	<p id="p_0">0</p>
	<p id="p_1">1</p>
	<p id="p_2">2</p>
	<p id="p_3">3</p>
	<p id="p_4">4</p>
	<p id="p_5">5</p>
	<p id="p_6">6</p>
	<p id="p_7">7</p>
	<p id="p_8">8</p>
	<p id="p_9">9</p>
	<p id="p_10">10</p>
	<p id="p_11">11</p>
	<p id="p_12">12</p>
	<p id="p_13">13</p>
	<p id="p_14">14</p>
	<p id="p_15">15</p>
	<p id="p_16">16</p>
	<p id="p_17">17</p>
	

</div>


<INPUT type="button" value="Scroll elemento 7" id=button1 name=button1 LANGUAGE=javascript onclick="return button1_onclick()">


<INPUT type="button" value="Scroll ultimo elemento" id=button2 name=button1 LANGUAGE=javascript onclick="return button2_onclick()">




<div id="div_2" style="height:100px;width:100px;background:yellow;overflow:auto;">
	<table>
		<tr><td>1</td></tr>
		<tr><td>2</td></tr>
		<tr><td>3</td></tr>
		<tr><td>4</td></tr>
		<tr><td>5</td></tr>
		<tr><td>6</td></tr>
		<tr><td>7</td></tr>
		<tr><td>8</td></tr>
		<tr><td>9</td></tr>
		<tr><td>10</td></tr>
	</table>
</div>


<INPUT type="button" value="Scroll ultimo elemento" id=button3 name=button3 LANGUAGE=javascript onclick="return button3_onclick()">



</BODY>
</HTML>

**Xinod** · 08-02-2006, 13:54

hai ragione, sembra rilevi rispetto all' inizio del documento e non rispetto al contenitore,
allora prova a scrollare alla differenza tra y e lo scrollTop del div_1
(chiaramente solo per i browser che si comportano come ffox)
ciao

Discussione: scroll div ultima riga immessa

Strumenti discussione

Ricerca discussione

Visualizza

scroll div ultima riga immessa

Permessi di invio