Schrift vergrößern

[Mark]

hi,

ich habe auf einer seite gesehen das man die schrift eines content-bereiches verkleinern und vergrößern kann, mich würde mal interessieren wie das geht.

beispiel seite: http://www.dns.de/  <-- hier oben rechts

thx

mark

[wahsaga]

hi,

ich habe auf einer seite gesehen das man die schrift eines content-bereiches verkleinern und vergrößern kann, mich würde mal interessieren wie das geht.

Wenn du mal in den Quelltext geschaut hättest, hättest du entdecken können, dass dort auf den Links mittels onClick die Javascript-Funktion setActiveStyleSheet() aufgerufen wird.

Also schau halt nach, was die macht und wie sie funktioniert ...

gruß,
wahsaga

[Mark]

Stimmt,

aber ich ich dachte da gäbe es irgendwo ein Tutorial oder so.

THX
Mark

[Gunnar Bittersmann]

Hello out there!

aber ich ich dachte da gäbe es irgendwo ein Tutorial oder so.

<http://de.selfhtml.org/@title=Gibt’s doch.> ;-)

See ya up the road,
Gunnar

[wahsaga]

hi,

aber ich ich dachte da gäbe es irgendwo ein Tutorial oder so.

Für so eine eigentlich recht triviale Aufgabe ...?

Na gut, bevor du mich gleich nach einem Tutorial zur Benutzung von Klopapier fragst, schreibe ich lieber zu diesem Thema was:

Die Schriftgröße legst du natürlich im CSS fest.
Besonders einfach "global" ändern kannst du die Schriftgröße auf der Seite natürlich, wenn du für alle Elemente relative Schriftgrößenangaben benutzt - em oder % beispielsweise.
Wenn du damit alle Elemente Bezug auf die Schriftgröße von html oder body nehmen lässt, bräuchtest du nur noch deren Schriftgröße ändern, um sie auf der ganzen Seite anzupassen.
Das könntest du z.B. über das style-Objekt machen - oder auch, in dem du z.B. body kurzerhand eine andere Klasse verpasst.

Über Änderung der Klasse "müsstest" du nicht mal relative Schriftgrößenangaben benutzen - du könntest auch per Nachfahrenselektor in deinem CSS für die Elemente unterhalb von body.klasse jeweils eigene Schriftgrößen für unterschiedliche body-Klassen definieren.

Es gibt natürlich auch noch komplexere Möglichkeiten, wie beispielsweise Austausch des per link-Element eingebundenen Stylesheets, oder direkte Manipulation der Style-Regeln per Javascript, etc.

gruß,
wahsaga

[Ingo Turski]

Hi,

Das könntest du z.B. über das style-Objekt machen - oder auch, in dem du z.B. body kurzerhand eine andere Klasse verpasst.

Warum sollte der body klassifiziert werden? Welche Elemente sollten noch diese Klasse bekommen?

freundliche Grüße
Ingo

[wahsaga]

hi,

Warum sollte der body klassifiziert werden?
Welche Elemente sollten noch diese Klasse bekommen?

Du willst darauf hinaus, dass es lieber eine ID sein sollte?

Zum einen halte ich das ändern der Klasse für unproblematischer in Bezug auf dynamische Änderungen der Darstellung - und zum anderen widerstrebt es mir, einem eindeutig identifizierbaren Element mehrere IDs im Austausch zu verpassen.

gruß,
wahsaga

[Ingo Turski]

Hi,

Du willst darauf hinaus, dass es lieber eine ID sein sollte?

Ja.

Zum einen halte ich das ändern der Klasse für unproblematischer in Bezug auf dynamische Änderungen der Darstellung - und zum anderen widerstrebt es mir, einem eindeutig identifizierbaren Element mehrere IDs im Austausch zu verpassen.

Wenn Du den Selektor ändern willst, magst Du recht haben. Dynamisch, d.h. über Javascript, würde ich in diesem Fall jedoch direkt die Eigenschaft ändern (wobei dann allerdings auch eine ID überflüssig wäre) - ist zwar eine Vermischung von CSS und JS, aber vertretbar, da diese ganze Aktion ohnehin nur über Javascript ins Dokument geschrieben werden sollte.
Und wenn das andererseits serverseitig gemacht würde, spräche wohl auch nichts gegen eine ID.

freundliche Grüße
Ingo

[wahsaga]

hi,

Dynamisch, d.h. über Javascript, würde ich in diesem Fall jedoch direkt die Eigenschaft ändern (wobei dann allerdings auch eine ID überflüssig wäre) - ist zwar eine Vermischung von CSS und JS, aber vertretbar,

Weniger vertretbar dann, wenn du die Alternative betrachtest, die ich beschrieb - das mit absoluten statt relativen Werten für Schriftgrößen gearbeitet werden soll/will.

Über

body.gross #elementXY { ... }
body.gross .klasseABC { ... }
...
body.mittel #elementXY { ... }
body.mittel .klasseABC { ... }
etc.

kann ich durch die einfache Zuweisung an document.body.className (oder ID, wenn's mehr beliebt) die Schriftgrößen auch für alle Inhaltselemente mit nur einer Anweisung ändern - würdest du lieber _alle_ in Frage kommenden Elemente einzeln durchlaufen, oder gar mit dynamischer Manipulation der Stylesheet-Regeln per JS anfangen ...?

Ich nicht, das wäre mir bei weitem zu aufwendig.

gruß,
wahsaga

[Ingo Turski]

Hi,

Weniger vertretbar dann, wenn du die Alternative betrachtest, die ich beschrieb - das mit absoluten statt relativen Werten für Schriftgrößen gearbeitet werden soll/will.

ohjeh... an sowas hatte ich gar nicht mehr gedacht. ;-)

freundliche Grüße
Ingo