Scrollbar
Dixi86
- javascript
0 Vinzenz Mai0 Gunnar Bittersmann
Hallo,
Ich bin total javascript-noobie und habe mir irgendwo her ein kleines Javascript her kopiert, welches Tabellen etc. ein und ausklappen lässt. Nur leider rutscht nach der Aktivierung die Scrollbar zum Seitenanfang. Ich hätte gerne das sie an der aktuellen Position verbleibt. Kann mir jemand sagen was ich im Script ergänzen muss.
<script type="text/javascript">
function toggle(id){
var img = 'img_' + id;
if(document.getElementById(id).style.display == 'block') {
document.getElementById(id).style.display = 'none';
} else {
document.getElementById(id).style.display = 'block';
}
}
</script>
<title>Unbenanntes Dokument</title>
</head>
<p><a href="#" onclick="toggle('layer1')"> Kommentar ein-/ausblenden</a></p>
<div id="layer1" style="display:none;">test impositon</div>
<body>
</body>
</html>
Vielen Dank
Dixi86
Hallo,
Nur leider rutscht nach der Aktivierung die Scrollbar zum Seitenanfang. Ich hätte gerne das sie an der aktuellen Position verbleibt. Kann mir jemand sagen was ich im Script ergänzen muss.
<title>Unbenanntes Dokument</title>
</head>
<body>
<p><a href="#" onclick="toggle('layer1')"> Kommentar ein-/ausblenden</a></p>
<div id="layer1" style="display:none;">test impositon</div>
</body>
</html>
das onclick-Ereignis ist nicht auf Links beschränkt. Da Du keine Linkfunktionalität benötigst, schlage ich Dir vor, auf das a-Element zu verzichten:
~~~html
<p onclick="toggle('layer1')">Kommentar ein-/ausblenden</p>
<div id="layer1" style="display:none;">test impositon</div>
Dein Code wird zusätzlich einfacher und kürzer :-)
Wenn Du unbedingt ein a-Element verwenden willst, so ergänze den onclick-Handler um "return false;", damit der Link nicht ausgeführt wird:
<a href="#" onclick="toggle('layer1'); return false;"> Kommentar ein-/ausblenden</a>
Freundliche Grüße
Vinzenz
Ohh man, die Lösung ist ja trivial,ist mir fasst unangenehm so ist dass wenn man copy$pasted... :-D
Aber vielen Dank dür die schnelle Antwort!!
Dixi86
Da Du keine Linkfunktionalität benötigst, schlage ich Dir vor, auf das a-Element zu verzichten:
Das wäre ziemlich nachteilig. Dann wäre der Link kein aktivierbares, fokussierbares Element mehr, was die Bedienung in vielen Fällen erschweren würde. Elemente mit »Verhalten« sollten auch Elemente wie a oder button sein, die vom Browser ohnehin als »Schaltflächen« behandelt werden und daher per Tastatur angesprungen und aktiviert werden können bzw. vom Browser entsprechend zugänglich gemacht werden.
Eine Alternative wäre tabindex="0", womit man beliebige Elemente fokussierbar machen kann.
Mathias
Hallo Mathias,
» Da Du keine Linkfunktionalität benötigst, schlage ich Dir vor, auf das a-Element zu verzichten:
Das wäre ziemlich nachteilig. Dann wäre der Link kein aktivierbares, fokussierbares Element mehr, was die Bedienung in vielen Fällen erschweren würde.
daran habe ich nicht gedacht. Ich kann Deine Argumente nachvollziehen ...
Elemente mit »Verhalten« sollten auch Elemente wie a oder button sein, die vom Browser ohnehin als »Schaltflächen« behandelt werden und daher per Tastatur angesprungen und aktiviert werden können bzw. vom Browser entsprechend zugänglich gemacht werden.
... und in Kombination mit Gunnars Hinweis auf einen noch recht verbreiteten Browser komme ich zur Überzeugung, dass der Einsatz eines a-Elementes durchaus sinnvoller sein kann als
Eine Alternative wäre tabindex="0", womit man beliebige Elemente fokussierbar machen kann.
diese von Dir angesprochene Alternative. Wenn ich zusätzlich den Fall deaktivierten Javascripts berücksichtige, plädiere ich nun dafür, das <p>-Element mit Javascript ins Dokument zu schreiben, das div-Element standardmäßig sichtbar zu haben und mit Javascript auszublenden, sowie Gunnars href-Attribut <a href="javascript:;">
zu verwenden, um bei abgeschalteten Javascript das den Benutzer nervende und unerwünschte Springen zum Dokumentanfang zu verhindern.
Da sieht man mal wieder, dass eine schnelle Antwort, die das vom Fragesteller angesprochene Problem durchaus beantwortet (die Problematik bei deaktiviertem Javascript war mir durchaus bewußt), viel zu wünschen übrig lassen kann. Danke für Deine Hinweise.
Freundliche Grüße
Vinzenz
@@Dixi86:
nuqneH
<a href="#">
ist in allen Fällen, wo man nicht an den Seitenanfang springen will, unsinnig.
Wenn ein 'a'-Element unbedingt ein 'href'-Attribut haben soll (bspw. damit IE 6 ':hover
' darauf anwendet), sich die Funktion des Links aber im 'onclick'-Handler verbirgt, bietet sich <a href="javascript:[code lang=javascript];
">[/code] an.
Qapla'