1. CSS/JavaScript Font Size Selector?
- Posted by jeremy (admin) Aug 13, 2009
- 1158 views
Jerry_Story said...
The new website could use a bigger font so it's easier to read.
Does anyone know how to make the JavaScript, CSS font size selector you see on some websites? You know the small a, bigger a, big a (small, medium or large font size)?
Jeremy
2. Re: CSS/JavaScript Font Size Selector?
- Posted by gbonvehi Aug 13, 2009
- 1150 views
You could try something like:
<html> <body> <a onclick="document.body.style.fontSize='1em';">1</a> <a onclick="document.body.style.fontSize='2em';">2</a> <a onclick="document.body.style.fontSize='3em';">3</a> </body> </html>
Cheers,
Guillermo Bonvehi
3. Re: CSS/JavaScript Font Size Selector?
- Posted by jeremy (admin) Aug 13, 2009
- 1149 views
Do you know how to make this persist via a user cookie set from javascript/read from javascript?
Jeremy
4. Re: CSS/JavaScript Font Size Selector?
- Posted by gbonvehi Aug 13, 2009
- 1093 views
- Last edited Aug 14, 2009
Let's try (this is untested):
// Borrowed from http://www.w3schools.com/JS/js_cookies.asp
function setCookie(c_name,value,expiredays)
{
var exdate=new Date();
exdate.setDate(exdate.getDate()+expiredays);
document.cookie=c_name+ "=" +escape(value)+
((expiredays==null) ? "" : ";expires="+exdate.toGMTString());
}
function getCookie(c_name)
{
if (document.cookie.length>0)
{
c_start=document.cookie.indexOf(c_name + "=");
if (c_start!=-1)
{
c_start=c_start + c_name.length+1;
c_end=document.cookie.indexOf(";",c_start);
if (c_end==-1) c_end=document.cookie.length;
return unescape(document.cookie.substring(c_start,c_end));
}
}
return "";
}
Now you need to add to body onload="" event a call to get the size set in the cookie and modify our change font function so...
<html>
<body onload="javscript: restoreEUFontSize();">
<a onclick="javascript: storeEUFontSize('1');">1</a>
<a onclick="javascript: storeEUFontSize('1');">2</a>
<a onclick="javascript: storeEUFontSize('1');">3</a>
</body>
</html>
function setEUFontSize(fsize) {
document.body.style.fontSize=fsize+'em';
}
function storeEUFontSize(fsize)
{
setCookie('eu4FontSize',fsize,90);
setEUFontSize(fsize);
}
function restoreEUFontSize() {
var fsize = getCookie('eu4FontSize');
if (fsize == '')
return;
setEUFontSize(fsize);
}
Edit: Fixed a typo
