div automatisch unten
WebWolf
- javascript
Suche jetzt schon eine ganze Weile im i-net danach:
Eine Funktion die ein div-Element nach unten scrollt.
Leider fanden sich nur Funktionen, die die komplette Seite scrollen.
Folgendes fand ich bei selfHTML:
<script type="text/javascript">
function NachOben () {
var y = 0;
if (window.pageYOffset) {
y = window.pageYOffset;
} else if (document.body && document.body.scrollTop) {
y = document.body.scrollTop;
}
if (y > 0) {
window.scrollBy(0, -10);
setTimeout("NachOben()", 10);
}
}
</script>
Was ich bisher versucht habe?
if (y < 1000) {
window.scrollBy(0, 10);
setTimeout("NachOben()", 10);
}
..funktioniert, doch leider nur im ganzen Fester.
Das div-element per document.getElementById auszuwählen habe ich bereits auch versucht; leider ohne Erfolg....
Hat jemand eine Idee?
MfG WebWolf
fals ich dich richtig verstanden habe solte das eigentlich auch per anker in html gehn
fals ich dich richtig verstanden habe solte das eigentlich auch per anker in html gehn
Hallo Hannes,
Sicher, das funktionert =)
Nur leider nicht so, wie ich möchte.
Die Scrollbar soll direkt unten sein und nicht erst nach aktivieren eines Hyperlinks.
Ein deartiges Verhalten der Scrollbar mit HTML zu realisieren ist meines Wissens nach nicht möglich.
mfg. WebWolf
Hi,
Hannes hat recht das geht auch per html ich hab das mal schnell für dich gebastelt.
Hier der Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>scroll</title>
<style type="text/css">
<!--
#scroll {
height: 200px;
width: 500px;
overflow: scroll;
}
body {
position: relative;
}
#anker {
background-color: #66FF00;
position: absolute;
left: 0px;
top: 0px;
}
#anker2 {
background-color: #66FF00;
position: absolute;
left: 150px;
top: 0px;
}
-->
</style>
</head>
<body>
<p> </p>
<p> </p>
<div id="scroll">
<a name="oben" id="oben"></a>
<p>Oben</p>
<p>
Inhalt</p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p>Unten <a name="unten" id="unten"></a>
</p>
<div id="anker"><a href="#unten">Nach unten scrolen</a></div><div id="anker2"><a href="#oben">Nach oben scrolen</a></div>
</div>
</body>
</html>
Ich hoffe das hilft dir
mfg Patrici
Hallo Patrici,
vielen Dank für deine Hilfe.
Leider kenne ich mich mit Ankern und deren Funktionen bestens aus und weiß daher, dass sich mein Problem nicht mit dessengleichen lösen lässt.
Die Scrollbar soll direkt nach Aufruf der Seite nach uten gesetzt werden, nicht etwa beim Anklicken eines Hyperlinks.
mfg WebWolf
dan nimm den queltext so wie er ist und füge am ende des links z.b #unten ein dan funktionierts auch dan must du nur deine domain bzw den link auch dahin linken das würde dan so aussehn:
http://forum.de.selfhtml.org/index.html#unten
^^^^^^
(der link funktioniert nicht aber wen du die seite dan hochgeladen hast und dan darauf linkst dan dan funktioniert es)
ganz wichtig ist das du ein div in den scroll div ganz unten absolut an body ausrichtest (oben) sonst scrollt der body auch nach unten
ich hoffe du hast es verstanden
mfg Patrici
dan nimm den queltext so wie er ist und füge am ende des links z.b #unten ein dan funktionierts auch dan must du nur deine domain bzw den link auch dahin linken das würde dan so aussehn:
http://forum.de.selfhtml.org/index.html#unten
^^^^^^
(der link funktioniert nicht aber wen du die seite dan hochgeladen hast und dan darauf linkst dan dan funktioniert es)ganz wichtig ist das du ein div in den scroll div ganz unten absolut an body ausrichtest (oben) sonst scrollt der body auch nach unten
ich hoffe du hast es verstanden
mfg Patrici
Wie schon gesagt: Mit Ankern kenne ich mich bestens aus. Vielen Dank für diesen Hinweis, doch ich werde in diesem Fall trotzdem zu JScript greifen, da mir mir die get-methode in diesem sinne nicht gefällt.
Schade, dass da keiner Verständnis für hat.
Habe bis jetzt folgende Funktion:
<Body onLoad="document.getElementById('chatbox').scrollTop = document.getElementById('chatbox').scrollHeight - document.getElementById('chatbox').offsetHeight;" >
Mängel hier dran habe ich allerdings auch, denn die Anweisungen im body-tag stören, zumal sie nur auf einer einzelnen Seite benötigt werden, die mit php in die richtige index.php eingebunden wird und nur die index.php einen body-tag enthält.
Zudem wäre es schöner, wenn sich das Scrollen wie im http://de.selfhtml.org/javascript/objekte/window.htm#scroll_by@title=selfHTML-Tutorial verhalten würde und sich der Cursor nicht direkt beim Aufrufen der Seite am unteren Rand befinden würde. Es sieht einfach besser aus und würde den Nutzer (wenn er denn JScript aktiviert hat) darauf hinweisen, dass der Inhalt gescroll wird bzw. wurde.
mfg
...der WebWolf