-
Anderer Fontsizer
Hallo ich habe hier noch ein anderes Javascript zur Schriftvergrößerung gefunden ich würde das liebend gerne in meine Contao - Seite einbinden ich weiß aber nicht wie und wo ich welche Teile vom Code einbinden muss. Mir ist auch bewusst das man es nicht machen soll aber, ich möchte die seite so Barrierefrei wie möglich machen.
der Quelltext auf der Webseite http://webbausteine.de/blog/javascri...se_aendern.php sieht so aus.
Code:
<!DOCTYPE HTML>
<html>
<head>
<title>Schriftgröße ändern</title>
<style>
body {
font-size: 12px;
font-family: Verdana, Arial, Sans-Serif;
}
</style>
<script>
function setFontSize(size) {
var body = document.getElementsByTagName('body');
for(var i = 0; i < body.length; i++) {
if (body[i].style.fontSize) {
var s = parseInt(body[i].style.fontSize.replace("%",""));
}
else {
var s = size;
}
body[i].style.fontSize = size + "%";
}
}
</script>
</head>
<body>
<p>
Schriftgröße ändern
<a style="font-size: 12px;" href="javascript:setFontSize('90');">A</a>
<a style="font-size: 14px;" href="javascript:setFontSize('100');">A</a>
<a style="font-size: 16px;" href="javascript:setFontSize('110');">A</a>
</p>
<p> Lorem ipsum dolor ...</p>
</body>
</html>
Danke im Voraus
-
Mal ohne den Sinn von Fontsizern jetzt zu thematisieren:
- binde das Script im Seitenlayout ein, womöglich ist 'eigener headercode' dafür der beste Platz
- lege ein Element an, dass die HTML-Struktur des Switchers abbildet und packe es ins Seitenlayout
Der von die referenzierte Beispiel-Quellcode macht ja die genaue Struktur nachvollziehbar.
-
Es gibt da auch einen anderen Fontsizer in Verbindung mit jQuery: http://www.byrnecreative.com/blog/fontscale/
Es ist praktisch, da die Fontgrößen in einem Cookie gespeichert werden und du die Bereiche die vergrößert werden sollen einfach festlegen kannst.
Das Plugin benötigt aber jQuery + jQuery Cookie + Fontscale Plugin.