Änderung Font-Style ohne erneutes laden der Seite
Andre
- javascript
moin,
ich bin schon seit einer weile auf der such aber hatte bisher keinen erfolg damit.
ich suche eine möglichkeit per click den font-style z.b. von verdana auf arial zu ändern ohne die seite neu laden zu müssen. hintergrund ist ein kleines feature für ne seite um designmöglichkeiten zu verdeutlichen.
ich kann bis jetzt position, farbe und größe des textes ändern. was noch fehlt ist die schriftart.
FRAGE: geht das überhaupt ohne ein erneutes laden der seite??? und wenn ja, dann wäre ich für ein kleines beispiel sehr verbunden.
schon mal danke an alle die sich der sache annehmen.
tschau, andre
Moin,
ich bin schon seit einer weile auf der such aber hatte bisher keinen erfolg damit.
ich suche eine möglichkeit per click den font-style z.b. von verdana auf arial zu ändern ohne die seite neu laden zu müssen.
FRAGE: geht das überhaupt ohne ein erneutes laden der seite??? und wenn ja, dann wäre ich für ein kleines beispiel sehr verbunden.
Ja, das geht. So auf die Schnelle mal ganz grob:
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>Fontwechsel</title>
<style>
body {font-size: 100.01%; font-family: Verdana,sans-serif;}
</style>
</head>
<body id="body">
<h3>Test-Text</h3>
<h4>Test-Text</h4>
<h5><a href="javascript:change_font()">Schriftart wechseln</a>
<script type="text/javascript">
function change_font() {
alert(document.getElementById("body").style.fontFamily)
if(document.getElementById("body").style.fontFamily == "Arial,sans-serif") document.getElementById("body").style.fontFamily = "Verdana,sans-serif;";
else document.getElementById("body").style.fontFamily = "Arial,sans-serif;"
}
</script>
</body>
</html>
Natürlich kann man das auch nur für einzelne Objekte machen anstatt wie im Beispiel für die ganze Seite.
Gruß Gunther
Tja, ist halt schon spät...!
Kleine Korrektur (alert war nur zum Testen und die Semikolons am Ende müssen weg).
So funktioniert das Script dann auch:
<script type="text/javascript">
function change_font() {
if(document.getElementById("body").style.fontFamily == "Arial,sans-serif") document.getElementById("body").style.fontFamily = "Verdana,sans-serif";
else document.getElementById("body").style.fontFamily = "Arial,sans-serif"
}
</script>
Gruß Gunther