Java Script Skin
Posted: Tue Jul 17, 2012 1:02 am
You can also do this with PHP as skins are often done, but Java Script skins are a simple alternative that work even if you don't have PHP support.
To keep all image codes in the CSS, display layout images as div backgrounds.
Use external CSS with an id:
Call the cookie from the body:
These go on the .js file.
Cookie oven (don't change it):
Bake the cookie (name, value, expiration):
Eat the cookie:
I have a bunch more codes in my notes page.
To keep all image codes in the CSS, display layout images as div backgrounds.
Use external CSS with an id:
Code: Select all
<link rel="stylesheet" id="designstyle" type="text/css" href="layout1.css" media="all" />Code: Select all
<body onload="tasteit()">Cookie oven (don't change it):
Code: Select all
function eatCookie(c_flavor) { if (document.cookie.length>0) { c_start=document.cookie.indexOf(c_flavor + "="); if (c_start!=-1) { c_start=c_start + c_flavor.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 ""; }
function bakeCookie(c_flavor,value,expiredays) { var exdate=new Date(); exdate.setDate(exdate.getDate()+expiredays); document.cookie=c_flavor+ "=" +escape(value)+ ((expiredays==null) ? "" : ";expires="+exdate.toUTCString()); }Code: Select all
var flavor = "1";
function bake1() { document.getElementById('designstyle').href = 'layout1.css';
flavor = "1"; bakeCookie('flavor',flavor,365); }
function bake2() { document.getElementById('designstyle').href = 'layout2.css';
flavor = "2"; bakeCookie('flavor',flavor,365); }Code: Select all
function tasteit() { flavor=eatCookie('flavor');
if (flavor=="1") { bake1(); }
if (flavor=="2") { bake2(); } }