Jeena Paradies: font-size ändern

Hallo,

Ich möchte eine Schrift-vergrößerungs und -verkleinerungsfunktion auf ein HTML-Dokument in JavaScript implementieren, da die Applikation nur die WebKit-Engine nutzt aber kein Browser ist und somit diese Möglichkeit fehlt.

Gleichzeitig habe ich keinen Einfluss auf das CSS oder HTML weil die Applikation vom User "Skinbar" ist, er sich also sein eigenes HTML, CSS und JavaScript schreiben kann. Ich kann allerdings auf das DOM zugreifen und JavaScript-Funktionen ausführen.

Mein Problem ist jetzt das man das ganze verschieden schreiben kann:

body { font-size: 10px; }  
body { font-size: 2em; }  
body { font-size: 110%; }  
body { font: italic 1cm Helvetica; }

Wenn ich den Text jetzt um 10% vergrößern möchte, wie mache ich das dann mit JavaScript?

Jeena

  1. Es gibt immer mehrere Ansatzweisen. Wenn Du es dem Benutzer überlassen willst, die Schriftgröße zu variieren, sollten die Vorgaben immer in em oder % gegeben werden.

    Dann kannst Du innerhalb der Webkit-Engine per JavaScript-Call eine style-Definition auf den body setzen. Wenn der Nutzer Angaben in px, mm, cm macht, wirst Du diese umrechnen müssen, bevor Du das CSS lädst.

    Übrigens halte ich es für eine Unsitte, Browser Engines als User Interface-Libraries zu mißbrauchen. Verwende lieber ein Toolkit, welches sich in den Desktop Deines Users integriert, dann brauchst Du Dir auch weniger Sorgen um Schriftgrößen zu machen.

    Gruß, LX

    --
    X-Self-Code: sh:( fo:) ch:~ rl:° br:> n4:& ie:% mo:) va:) de:] zu:) fl:{ ss:) ls:~ js:|
    X-Self-Code-Url: http://emmanuel.dammerer.at/selfcode.html
    X-Will-Answer-Email: Unusual
    X-Please-Search-Archive-First: Absolutely Yes
    1. Hallo,

      Übrigens halte ich es für eine Unsitte, Browser Engines als User Interface-Libraries zu mißbrauchen. Verwende lieber ein Toolkit, welches sich in den Desktop Deines Users integriert, dann brauchst Du Dir auch weniger Sorgen um Schriftgrößen zu machen.

      Das doofe ist dann, dass man dann als User keine (einfache) Möglichkeit mehr hat das aussehen seinen Wünschen nach anzupassen.

      Jeena

  2. Hi,

    Wenn ich den Text jetzt um 10% vergrößern möchte, wie mache ich das dann mit JavaScript?

    1.) dafür sorgen, dass der Inhalt des <body> in einem einzigen Element untergebracht ist,
    2.) diesem Element eine Schriftgröße von 110% oder 1.1em geben.

    Cheatah

    --
    X-Self-Code: sh:( fo:} ch:~ rl:| br:> n4:& ie:% mo:) va:) de:] zu:) fl:{ ss:) ls:~ js:|
    X-Self-Code-Url: http://emmanuel.dammerer.at/selfcode.html
    X-Will-Answer-Email: No
    X-Please-Search-Archive-First: Absolutely Yes
  3. Hallo,

    Ok, nevermind, ich hätte ja vielleicht selbst mal testen können:

    var fontSize = document.defaultView.getComputedStyle(body, "").getPropertyValue("font-size");

    gibt die Fontgröße immer in px zurück, deshalb kann man einfach so machen:

    document.getElementByTagName("body")[0].style.fontSize = fontSize * multiplicator;

    Jeena

    1. Hallo Jeena,

      document.getElementByTagName("body")[0].style.fontSize = fontSize * multiplicator;

      das wird eine interessante Rechnung: 16px * 1.1 -> NaN

      Gruß, Jürgen

      1. Hallo,

        Hallo Jeena,

        document.getElementByTagName("body")[0].style.fontSize = fontSize * multiplicator;

        das wird eine interessante Rechnung: 16px * 1.1 -> NaN

        Gruß, Jürgen

        Jeena

      2. Hallo,

        Oh man wie recht du hast, haha, danke für den Hint.

        Jeena