(Stand: 23.12.24, Adresse: http://www.grammiweb.de/html/html065.shtml)
Scrollbare Bereiche auf Webseiten
Reicht der Platz im Layout nicht aus, einen längeren Text unterzubringen, kann dieser auch in einen eigenen Bereich verschoben werden, der dann je nach Bedarf mit Scrollleisten versehen wird.
Ein Beispiel:
Diese Variante wird von allen aktuellen Browsern unterstützt. Ältere Anzeigeprogramme wie der Netscape Navigator 4.7 zeigen statt dessen einfach den kompletten Text in einer entsprechend angepassten Box an - die Information geht also so oder so nicht verloren.
Der Quellcode:
In den Seitenkopf (zwischen <HEAD> und </HEAD>) wird folgender Quelltext eingefügt (sofern bereits CSS-Definitionen vorhanden sind, können Sie die ".scrollen"-Zeile auch einzeln in diese integrieren):
<style type="text/css">
.scrollen { width: BREITE; height: HÖHE;
overflow: AUTO; padding: TEXTABSTAND; background: HINTERGRUNDFARBE;
border: RAHMEN}
</style>
Die Anweisung zu unserem Beispiel oben:
.scrollen { width: 300px; height: 100px; overflow: auto; padding: 10px; background: #F2F7D3; border: 1px solid #B6D303 }
Anschließend fügen Sie den Text in den Seitenkörper (zwischen <BODY> und </BODY>) an der Stelle ein, an der der scrollbare Bereich erscheinen soll. Markieren Sie dann den gewünschten Text mit der CSS-Definition "scrollen":
<div class="scrollen">
... Text ...
</div>
© Grammiweb.de Internetlösungen. Alle Rechte vorbehalten. Stand: 23.12.2024
Seitenanfang - Sponsor werden - Datenschutz - Medien - Impressum - Werbung - Hilfe - Kontakt