overflow:auto - Scrollbar-Ereignis abfangen
dicon
- javascript
Hi Boardies,
ich würde gern eine Idee aus diesem Thread fortführen. Zusammengefasst ging’s Pitter darum,
überlangen Text innerhalb eines DIVs einzukürzen und dem geneigten Leser mit "..." zu zeigen,
dass es da noch mehr gibt. Eine Überlegung führte zu folgender Frage
Kann man den Punkt bzw. das Zeichen abfangen, der/das bei zu
langem Text zum Anzeigen der Scrollbars führt?
Grundlage für die Frage war, die Überlänge des Textes mittels overflow:hidden zu verstecken.
Jonathan hat die Frage beantwortet, trotzdem hat mich die Geschichte nicht in Ruhe gelassen.
Rausgekommen ist folgende Spielerei (Code verkürzt):
...
<head>
...
<script type="text/javascript">
function isScrollbar(){
var elem = document.getElementById('scroll');
var x = elem.scrollHeight;
var y = elem.offsetHeight;
if(x) {
if(x == y) {
return;
} else {
elem.style.border = '#006633 solid 1px;';
}
} else {
alert('Klappt nicht');
}
}
</script>
</head>
<body onload="isScrollbar()">
<div id="scroll" style="height:100px; width:100px; overflow:hidden;">
Lorem ipsum dolor sit amet, consectetur adipisici elit, sed eiusmod tempor
incidunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis
nostrud exercitation ullamco laboris nisi ut aliquid ex ea commodi consequat.
Quis aute iure reprehenderit
</div>
</body>
...
Im Codebeispiel habe ich overflow:hidden gesetzt und im else-Block das border-Attribut geändert
um zu prüfen, ob der Effekt greift. In diesem Block könnte jetzt eine Funktion zum einkürzen des
Textes und setzen der 3 "..." notiert werden. Das müsste doch klappen - oder?!
Der Ansatz war, das offsetHeight und scrollHeight im Dom den gleichen Wert haben, wenn keine
Scrollbalken angezeigt werden, der Text also ins DIV passt. Bei overflow:auto und zu
langem Text kommen die Balken und der scrollHeight-Wert ändert sich. Der Frage:
Kann man den Punkt bzw. der Zeichen abfangen...
könnte man damit doch mit JA beantworten - zumindest für den "Punkt", der dazu führt.
Wie seht ihr das?
Grüße, dicon
PS: Zum Einkürzen des Textes und setzen der "..." ist mir dann nix mehr eingefallen... das würd
ich eigentlich in PHP machen ;o)
PS II: Sorry Stonie - ich glaub da ist wieder das böse Wort in der Begrüßung ;o))