Schriftgrösse mit Javascript ändern

[coldstone28]

Hallo,

versuche vergebens die schriftgrösse per JavaScript ändern zu lassen, aber klappt nicht.

Meine Javascipt habe ich wie folgt:

function change_font() {
    document.getElementsByTagName('body').style.fontSize = '10px';
}

Meine css:

body {
    font-family: 'Roboto', sans-serif;
    line-height: 1.5em;
    font-size: 16px;
}

Müsste doch jetzt eigentlich die schriftgrösse in meinem "body" auf 10px setzen. Macht er aber nicht.
Ist irgendwas an der Syntax vom JavaScript falsch?

 

[Tommy57]

Verwendest du jQuery?
Rufst du die Funktion change_font() in deinem Script auf?
Wann rufst du sie auf?

 

[coldstone28]

Nein jQuery verwende ich nicht.
Habe in meiner HTML folgendes stehen:

<a href="" onclick="change_font()"><div id="text_bigger"><small>A</small> &rarr; A</div></a>

wenn ich draufklicke, wird für eine sekunde die textgrösse geändert, er springt aber immer wieder zurück auf den alten Wert.

 

[coldstone28]

Ok, ich habe glaube den fehler.
Wenn ich meinen Javascript in einer einfachen div container aufrufe, funktioniert es.
Ich glaube hier habe ich was falsch. In einer referenz ein div container ist glaube ich nicht so gut.

<a href="" onclick="change_font()"><div id="text_bigger"><small>A</small> &rarr; A</div></a>

 

[Tommy57]

Naja, du verwendest einen Link. Dieser lädt die Seite neu. Deswegen siehst du den Effekt auch nur ganz kurz. Entweder verwendest du keinen Link, oder du schreibst href="#" oder schreibst onclick="change_font();return false;"

 

[coldstone28]

jetzt funktioniert es wieder nicht mehr. Ich bin echt am verzweifeln.
Was ist denn hier falsch?

JS

function change_font() {
    document.getElementsByTagName('body').style.fontSize = '50px';
}

HTML

<div onclick="change_font()" class="text_size" id="text_bigger">A+</div>

 

[basti1012]

kein wunder das es nicht geht.

probier es mal so

function change_font() {
    document.getElementsByTagName('body')[0].style.fontSize = '50px';
}

By TagName und ClassName gehöhrt eine Zahl hinter dem ('bla')[0];
By einer id (weil die nur einmal ein einen dokument vorkommen darf) darf keine Zahl stehen

 

[coldstone28]

kein wunder das es nicht geht.

probier es mal so

function change_font() {
    document.getElementsByTagName('body')[0].style.fontSize = '50px';
}

By TagName und ClassName gehöhrt eine Zahl hinter dem ('bla')[0];
By einer id (weil die nur einmal ein einen dokument vorkommen darf) darf keine Zahl stehen

Das habe ich auch schon versucht aber ohne erfolg. Klappt nicht

 

[Tommy57]

hier funktioniert es:
Edit fiddle - JSFiddle

 

[coldstone28]

Ist echt komisch. Habe es 1 zu 1 so stehen. Alle anderen Javascript funktionen in meinem dokument funktonieren auch.