var checkboxheight = "25"; var radioheight = "25"; var selectwidth = "135"; /* no need to change anything after this */ document.write(''); var custom = { init: function() { var inputs = document.getelementsbytagname("input"), span = array(), textnode, option, active; for(a = 0; a < inputs.length; a++) { if((inputs[a].type == "checkbox" || inputs[a].type == "radio") && inputs[a].classname.indexof("styled") > -1) { span[a] = document.createelement("span"); span[a].classname = inputs[a].type; if(inputs[a].checked == true) { if(inputs[a].type == "checkbox") { position = "0 -" + (checkboxheight*2) + "px"; span[a].style.backgroundposition = position; } else { position = "0 -" + (radioheight*2) + "px"; span[a].style.backgroundposition = position; } } inputs[a].parentnode.insertbefore(span[a], inputs[a]); inputs[a].onchange = custom.clear; if(!inputs[a].getattribute("disabled")) { span[a].onmousedown = custom.pushed; span[a].onmouseup = custom.check; } else { span[a].classname = span[a].classname += " disabled"; } } } inputs = document.getelementsbytagname("select"); for(a = 0; a < inputs.length; a++) { if(inputs[a].classname.indexof("styled") > -1) { option = inputs[a].getelementsbytagname("option"); active = option[0].childnodes[0].nodevalue; textnode = document.createtextnode(active); for(b = 0; b < option.length; b++) { if(option[b].selected == true) { textnode = document.createtextnode(option[b].childnodes[0].nodevalue); } } span[a] = document.createelement("span"); span[a].classname = "select"; span[a].id = "select" + inputs[a].name; span[a].appendchild(textnode); inputs[a].parentnode.insertbefore(span[a], inputs[a]); if(!inputs[a].getattribute("disabled")) { inputs[a].onchange = custom.choose; } else { inputs[a].previoussibling.classname = inputs[a].previoussibling.classname += " disabled"; } } } document.onmouseup = custom.clear; }, pushed: function() { element = this.nextsibling; if(element.checked == true && element.type == "checkbox") { this.style.backgroundposition = "0 -" + checkboxheight*3 + "px"; } else if(element.checked == true && element.type == "radio") { this.style.backgroundposition = "0 -" + radioheight*3 + "px"; } else if(element.checked != true && element.type == "checkbox") { this.style.backgroundposition = "0 -" + checkboxheight + "px"; } else { this.style.backgroundposition = "0 -" + radioheight + "px"; } }, check: function() { element = this.nextsibling; if(element.checked == true && element.type == "checkbox") { this.style.backgroundposition = "0 0"; element.checked = false; } else { if(element.type == "checkbox") { this.style.backgroundposition = "0 -" + checkboxheight*2 + "px"; } else { this.style.backgroundposition = "0 -" + radioheight*2 + "px"; group = this.nextsibling.name; inputs = document.getelementsbytagname("input"); for(a = 0; a < inputs.length; a++) { if(inputs[a].name == group && inputs[a] != this.nextsibling) { inputs[a].previoussibling.style.backgroundposition = "0 0"; } } } element.checked = true; } }, clear: function() { inputs = document.getelementsbytagname("input"); for(var b = 0; b < inputs.length; b++) { if(inputs[b].type == "checkbox" && inputs[b].checked == true && inputs[b].classname.indexof("styled") > -1) { inputs[b].previoussibling.style.backgroundposition = "0 -" + checkboxheight*2 + "px"; } else if(inputs[b].type == "checkbox" && inputs[b].classname.indexof("styled") > -1) { inputs[b].previoussibling.style.backgroundposition = "0 0"; } else if(inputs[b].type == "radio" && inputs[b].checked == true && inputs[b].classname.indexof("styled") > -1) { inputs[b].previoussibling.style.backgroundposition = "0 -" + radioheight*2 + "px"; } else if(inputs[b].type == "radio" && inputs[b].classname.indexof("styled") > -1) { inputs[b].previoussibling.style.backgroundposition = "0 0"; } } }, choose: function() { option = this.getelementsbytagname("option"); for(d = 0; d < option.length; d++) { if(option[d].selected == true) { document.getelementbyid("select" + this.name).childnodes[0].nodevalue = option[d].childnodes[0].nodevalue; } } } } window.onload = custom.init;