Printable View
Hi,
I am working on a text only version of my website and I am trying to create a javascript that can change the text size - this part works, but i need it to store the info in a cookie so that when you click to go to another page the text is the size you set it, I also need to so that you can change the text colour and the background colour.
www.christian-kids.net/textonly - have the working text sizer
thanks
so does anyone know how this can be done ?
here, i made this code up for you (edit it as needed):
HTML Code:<html>
<head>
<script type="text/javascript">
function setCookie(name, value, expires, path, domain, secure)
{
document.cookie= name + "=" + escape(value) +
((expires) ? "; expires=" : "") +
((path) ? "; path=" + path : "") +
((domain) ? "; domain=" + domain : "") +
((secure) ? "; secure" : "");
}
function getCookie(name)
{
var dc = document.cookie;
var prefix = name + "=";
var begin = dc.indexOf("; " + prefix);
if (begin == -1)
{
begin = dc.indexOf(prefix);
if (begin != 0) return null;
}
else
{
begin += 2;
}
var end = document.cookie.indexOf(";", begin);
if (end == -1)
{
end = dc.length;
}
return unescape(dc.substring(begin + prefix.length, end));
}
function deleteCookie(name, path, domain)
{
if (getCookie(name))
{
document.cookie = name + "=" +
((path) ? "; path=" + path : "") +
((domain) ? "; domain=" + domain : "") +
"; expires=Thu, 01-Jan-70 00:00:01 GMT";
}
}
</script>
</head>
<body onload="Javascript: if(getCookie('size') && getCookie('color')){document.getElementById('txt').style.color = getCookie('color'); document.getElementById('txt').style.fontSize = getCookie('size');}">
<form name="form">
size: <input type="size" name="size" size="20" value="20px"><br>
color:<input type="text" name="color" size="20" value="blue"><br>
<input type="button" onClick="Javascript: document.form('size').value='20px'; document.form('color').value='blue'; deleteCookie('size','',''); deleteCookie('color','','');" value="clear" name="clear">
<input type="button" onclick="Javascript: document.getElementById('txt').style.color=document.form('color').value; document.getElementById('txt').style.fontSize=document.form('size').value;" value="apply" name="apply">
<input type="button" onclick="Javascript: setCookie('color',document.getElementById('txt').style.color,'','','',''); setCookie('size',document.getElementById('txt').style.fontSize,'','','','')" value="Save" name="save">
<br>
<br>
</form>
<font id="txt">Example</font>
</body>
</html>