Forum PHP.pl > Scrollowanie Diva

Pomoc - Szukaj - Użytkownicy - Kalendarz

Forum PHP.pl > Forum > Po stronie przeglądarki > JavaScript

mkozak

16.01.2008, 12:23:41

Siema

Mam DIV-a z style overflow:auto - wygląda jak Iframe.

Do tej ramki wrzucam sobie rozmowę chatową, ale jak się ramka kończy i zaczyna się scrolowanie to widać górę rozmowy, a to co świerze jest na dole (bug).

jak przescrolować div-a za pomocą JS-a?

Próbowałem dać tak jak jest w window tylko, że document.getElementById("main").scrollBy(0,50); - ale nie działą.

jakiś pomysł, żeby div był przescrollowany na sam duł za każdym razem??

chlebik

23.01.2008, 01:15:29

Cytat(mkozak @ 16.01.2008, 12:23:41 )

Co to znaczy "wrzucam sobie"? Wkladasz tekst do DIVa, kod HTML czy co?

Cytat

jak przescrolować div-a za pomocą JS-a?

Próbowałem dać tak jak jest w window tylko, że document.getElementById("main").scrollBy(0,50); - ale nie działą.

jakiś pomysł, żeby div był przescrollowany na sam duł za każdym razem??

Metoda scrollBy jest mozliwa tylko w przypadku obiektu Window ---> W3C Schools sa tutaj pomocne.
Nie do konca rozumiem jak to mozliwe, ze nie widac "reszty" - podejrzyj w takim razie alertem czy inszym ustrojostwem czy we wspomnianym DIVie w ogole w VALUE masz caly wklejony tekst.

Daj znac i bedziem myslec dalej
Chlebik

arecki

25.01.2008, 00:28:22

Powinno działać

[HTML] pobierz, plaintext 
<html>
<head>
<title>test divow </title>
<script type="text/javascript">
 
function addTextToResults() {
	var textField = document.getElementById('addToResults');
	var resultsDiv = document.getElementById('results');
 
	resultsDiv.innerHTML += textField.value+"<br/>";
	textField.value = '';
	resultsDiv.scrollTop = resultsDiv.scrollHeight - resultsDiv.clientHeight;
}
 
</script>
<style type="text/css">
body {
	font-family:georgia;
	font-size:	14px;
	color:		#000;
}
 
#results {
	margin:		10px auto;
	width: 		400px;
	height:		200px;
	overflow:	auto;
	border:		1px solid #cecece;
}
 
#newentry {
	margin:		10px auto;
	width:		400px;
}
 
#newentry input {
	width:		180px;
	margin:		0px 5px;
}
</style>
</head>
<body>
<div id="results"></div>
<div id="newentry">
	<input type="text" id="addToResults"/>
	<input type="button" value="dodaj" onclick="javascript:addTextToResults();"/>
</div>
</body>
</html>
[HTML] pobierz, plaintext

To jest wersja lo-fi głównej zawartości. Aby zobaczyć pełną wersję z większą zawartością, obrazkami i formatowaniem proszę kliknij tutaj.