Browser Compatibility Problem

[pleek]

Ok, so im making an image creator/generator for my forum. And i started out using firefox to view it in but after a while i change to chrome for speed reasons. So i added like 3 new features and then today i was using firefox and it doesn't work now and I'm not sure why. It works correctly unless the user clicks on "Card Two". In Chrome the image (Card) changes and the options come up. But in firefox and IE nothing happens. Can someone take a look at my source pages and show me how to make it cross browser compatible?

 

Generator.template.php is the smf custom page where the problem is. If i copy the url of the created image from chrome and put it in FF it shows up so i know its part of the template page. The feature i added is the onclick script that changes the src of the image and shows/hides the options div. Im quite sure its a problem with the DOM thats making it not work. Here is that part.

 

<SCRIPT TYPE='text/javascript'>

function Change(options) {

    var newSrc;
    newSrc  = 'http://craigh.tlcrepair.net/ConsoleCard/ConsoleCard';
    newSrc +=  CardChooser.options[CardChooser.selectedIndex].value;
newSrc += '/index.php';
    newSrc += '?UserName=$UserName';
    newSrc += '&Posts=$UserPosts';
    newSrc += '&PS=$PersonalText';
    newSrc += '&Site=$Website';
    newSrc += '&Av=$UserAvatar';
    newSrc += '&Group=$Group';
    newSrc += '&BG=' + BGChooser.options[bGChooser.selectedIndex].value;
    newSrc += '&Font=' + FontChooser.options[FontChooser.selectedIndex].value;
    
    document.getElementById('Card').src = newSrc;
    document.getElementById('Options').style.visibility = options; 
    document.getElementById('Font').style.visibility = options;
}

</SCRIPT>";

 

[attachment deleted by admin]