animcentral
06-26-2009, 10:00 PM
The following script can be used to allow visitors to increase or decrease the size of text on your page. This can be useful for visitors who have trouble reading smaller text and allows them to increase it to something they can view more easily.
Template edits:
add the following script in Header
<script type="text/javascript" language="javascript">
var min=8;
var max=18;
function increaseFontSize() {
var p = document.getElementsByTagName('div');
for(i=0;i<p.length;i++) {
if(p[i].style.fontSize) {
var s = parseInt(p[i].style.fontSize.replace("px",""));
} else {
var s = 12;
}
if(s!=max) {
s += 1;
}
p[i].style.fontSize = s+"px"
}
}
function decreaseFontSize() {
var p = document.getElementsByTagName('div');
for(i=0;i<p.length;i++) {
if(p[i].style.fontSize) {
var s = parseInt(p[i].style.fontSize.replace("px",""));
} else {
var s = 12;
}
if(s!=min) {
s -= 1;
}
p[i].style.fontSize = s+"px"
}
}
</script>
and the following anywhere you wanna show the icons:
<div>
<a href="javascript:increaseFontSize();"><img src="font-inc.gif" alt="Increase Font Size" style="border:0px;" /></a>
<a href="javascript:decreaseFontSize();"><img src="font-dec.gif" alt="Decrease Font Size" style="border:0px;" /></a>
</div>
Icons:
http://fa.animcentral.com/forums/font-inc.gif http://fa.animcentral.com/forums/font-dec.gif
Demo:
http://fa.animcentral.com/forums/
comment: Persian Language
Template edits:
add the following script in Header
<script type="text/javascript" language="javascript">
var min=8;
var max=18;
function increaseFontSize() {
var p = document.getElementsByTagName('div');
for(i=0;i<p.length;i++) {
if(p[i].style.fontSize) {
var s = parseInt(p[i].style.fontSize.replace("px",""));
} else {
var s = 12;
}
if(s!=max) {
s += 1;
}
p[i].style.fontSize = s+"px"
}
}
function decreaseFontSize() {
var p = document.getElementsByTagName('div');
for(i=0;i<p.length;i++) {
if(p[i].style.fontSize) {
var s = parseInt(p[i].style.fontSize.replace("px",""));
} else {
var s = 12;
}
if(s!=min) {
s -= 1;
}
p[i].style.fontSize = s+"px"
}
}
</script>
and the following anywhere you wanna show the icons:
<div>
<a href="javascript:increaseFontSize();"><img src="font-inc.gif" alt="Increase Font Size" style="border:0px;" /></a>
<a href="javascript:decreaseFontSize();"><img src="font-dec.gif" alt="Decrease Font Size" style="border:0px;" /></a>
</div>
Icons:
http://fa.animcentral.com/forums/font-inc.gif http://fa.animcentral.com/forums/font-dec.gif
Demo:
http://fa.animcentral.com/forums/
comment: Persian Language