Ich mache das mit JS und CSS wobei ich am oberten Rand der Seite drei Buttons dafür anbiete:
<a onclick="javascript:small()" onmouseover="Tip('Schrift kleiner')" onmouseout="UnTip()"><img src="../images/grafik/social_a_small.png" alt=""></a>
<a onclick="javascript:medium()" onmouseover="Tip('Schrift normal')" onmouseout="UnTip()"><img src="../images/grafik/social_a_medium.png" alt=""></a>
<a onclick="javascript:large()" onmouseover="Tip('Schrift größer')" onmouseout="UnTip()"><img src="../images/grafik/social_a_large.png" alt=""></a>
Da ich nicht alle Texte variabel anbieten möchte, setze ich die Textpassagen in einzelne Div <div id="DynText1"> und verändere bei großen Schriften auch die Zeilenhöhe für bessere lesbarkeit. Da die Werte in "%" angegeben sind, bezieht sich die Vergrößerung immer auf die im Basis CSS verwendeten Schriftgrößen.
DAmit wird <p> ebenso um 120 % vergrößert wie <h1> wenn es innerhalb des DIV steht.
function small()
{
document.all.DynText1.style.fontSize = "80%";
document.all.DynText2.style.fontSize = "80%";
}
function medium()
{
document.all.DynText1.style.fontSize = "100%";
document.all.DynText2.style.fontSize = "100%";
}
function large()
{
document.all.DynText1.style.fontSize = "135%";
document.all.DynText1.style.lineHeight = "180%";
document.all.DynText2.style.fontSize = "135%";
document.all.DynText2.style.lineHeight = "180%";
}
Kann man sich auf meiner HP ansehen http://www.werbefoto2000.de.
Gruß Robert