[LiamSwan]

Add this between the head tags

<script type="text/javascript" src="checkbox.js"></script>

Create checkbox.js and insurt it into your directory
The following is the content of checkbox.js
You don't need to understand it, just embed it into your page and it'll work
The only thing you may want to change (/add) are the false.png and true.png

//global variables that can be used by ALL the function son this page. 
var inputs; 
var imgFalse = 'false.png'; 
var imgTrue = 'true.png'; 

//this function runs when the page is loaded, put all your other onload stuff in here too. 
function init() { 
    replaceChecks(); 
} 

function replaceChecks() { 
     
    //get all the input fields on the page 
    inputs = document.getElementsByTagName('input'); 

    //cycle trough the input fields 
    for(var i=0; i < inputs.length; i++) { 

        //check if the input is a checkbox 
        if(inputs[i].getAttribute('type') == 'checkbox') { 
             
            //create a new image 
            var img = document.createElement('img'); 
             
            //check if the checkbox is checked 
            if(inputs[i].checked) { 
                img.src = imgTrue; 
            } else { 
                img.src = imgFalse; 
            } 

            //set image ID and onclick action 
            img.id = 'checkImage'+i; 
            //set image 
            img.onclick = new Function('checkChange('+i+')'); 
            //place image in front of the checkbox 
            inputs[i].parentNode.insertBefore(img, inputs[i]); 
             
            //hide the checkbox 
            inputs[i].style.display='none'; 
        } 
    } 
} 

//change the checkbox status and the replacement image 
function checkChange(i) { 

    if(inputs[i].checked) { 
        inputs[i].checked = ''; 
        document.getElementById('checkImage'+i).src=imgFalse; 
    } else { 
        inputs[i].checked = 'checked'; 
        document.getElementById('checkImage'+i).src=imgTrue; 
    } 
} 

window.onload = init;