Hi there 
I'm wondering if it's possible to successfully be able to offer a series of four options where a user (that might have a visual impairment) can increase the entire page font size, by using javascript to modify three different div's styling?
I've found a script which i've included below which does this but unfortunatly it only works if you only have the one div ... I need it to work with at least 3 div's and don't know enough about javascript to be able to edit it. Also ... when I tried out the script IE brought up one of those nasty yellow security banners at the top before displaying it which I definetly don't want to be there.
I was hoping someone could have a bit of a play around with the script?
Thanks
I'm wondering if it's possible to successfully be able to offer a series of four options where a user (that might have a visual impairment) can increase the entire page font size, by using javascript to modify three different div's styling?
I've found a script which i've included below which does this but unfortunatly it only works if you only have the one div ... I need it to work with at least 3 div's and don't know enough about javascript to be able to edit it. Also ... when I tried out the script IE brought up one of those nasty yellow security banners at the top before displaying it which I definetly don't want to be there.
I was hoping someone could have a bit of a play around with the script?
Thanks
Code:
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<script type="text/javascript">
function cFont(toValue){
var allDivs=document.getElementsByTagName("DIV");
for (i=0;i<allDivs.length;i++){
allDivs[i].className=toValue;
}
}
</script>
<style>
.medium {
font-size:100%;
}
.large {
font-size:120%;
}
.xlarge {
font-size:140%;
}
</style>
</head>
<body>
<div class="medium">
<h2>Random Heading</h2>
<p>Some random text</p>
Select Font size:
<select onchange="cFont(this.value)">
<option value="medium">Medium</option>
<option value="large">Large</option>
<option value="xlarge">XLarge</option>
</select>
</div>
</body>
</html>
