Background Colour on Checkboxes

JavaScript and client side scripting.

Moderator: General Moderators

Post Reply
User avatar
phppage
Forum Contributor
Posts: 126
Joined: Mon Apr 24, 2006 1:47 pm
Location: West Yorkshire, UK

Background Colour on Checkboxes

Post by phppage »

I'm trying to set a background colour on a checkbox but does not seem to work on any browser. Just setting a background colour in CSS sheet the same you would for anything else. I am using the same class on other inputs such as text and works fine. Reading around the Internet there looks to be some issues with this. Would anyone know of any way round this problem.


Many Thanks
User avatar
JellyFish
DevNet Resident
Posts: 1361
Joined: Tue Feb 14, 2006 7:18 pm
Location: San Diego, CA

Post by JellyFish »

opera appears to allow background color change on their chackboxes. However IE 6 seems to not work so good as you may already know.

I dont' know of any way to change the background color of a chackbox element on IE. Maybe you could take into consideration of making a chackbox duplicate with javascript.
User avatar
phppage
Forum Contributor
Posts: 126
Joined: Mon Apr 24, 2006 1:47 pm
Location: West Yorkshire, UK

Post by phppage »

JellyFish wrote:Maybe you could take into consideration of making a chackbox duplicate with javascript.
Not a bad idea, many thanks for that. :)
User avatar
JellyFish
DevNet Resident
Posts: 1361
Joined: Tue Feb 14, 2006 7:18 pm
Location: San Diego, CA

Post by JellyFish »

Go to: http://htmledit.squarefree.com and type:

Code: Select all

<html>
<head>
<style>
#cbox {
background-color: #fff;
width: 13px;
height: 13px;
border: 1px solid #047;
}
</style>
<script>
function body_onload()
{
Checkbox = document.getElementById("cbox");
}
function checkbox_onclick()
{
(Checkbox.background) ? Checkbox.background = "" : Checkbox.background = "http://img208.imageshack.us/img208/674/checkmw8.png";
}
</script>
</head>
<body onload="body_onload()">
<table cellspacing="0" cellpadding="0" id="cbox" onclick="checkbox_onclick()"><tr><td></td></tr></table>
<br>
<input type="checkbox">
</body>
</html>
Just need some more work. 'Ope tat 'elps.
User avatar
Luke
The Ninja Space Mod
Posts: 6424
Joined: Fri Aug 05, 2005 1:53 pm
Location: Paradise, CA

Post by Luke »

User avatar
phppage
Forum Contributor
Posts: 126
Joined: Mon Apr 24, 2006 1:47 pm
Location: West Yorkshire, UK

Post by phppage »

Wow, thanks for those folks. Was going to go off and write my own last night. I'm glad I didn't.
The Ninja Space Goat wrote:check this out: viewtopic.php?t=56920&highlight=
The download links don't seem to work on this page goat. Do you know of any mirror sites at all?
Post Reply