Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 2 of 2
  1. #1
    New to the CF scene
    Join Date
    Aug 2008
    Posts
    1
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Javascript will not work in Firefox

    Hi all,

    I have a small script that works fine in IE but will not work at all in Firefox. I checked the Firefox error log, but it didn't show anything. I corrected the errors that were keeping the page from being validated, but that didn't help either. Any help would be greatly appreciated. Here is the page address:

    http://nailzfan.gotdns.com/Cube.html

    Here is the code:

    Code:
    <script language="javascript" type="text/javascript">
    
        if(document.images)
        {
          imagemap_default = new Image();
          imagemap_default.src = 'background .gif';
          imagemap_home = new Image();
          imagemap_home.src = 'bg1.gif';
    	  imagemap_num2 = new Image();
    	  imagemap_num2.src = 'bg2.gif';
    	  imagemap_num3 = new Image();
    	  imagemap_num3.src = 'bg3.gif';
    	  imagemap_num4 = new Image();
    	  imagemap_num4.src = 'bg4.gif';
     
        }
       function rollOver(iName,iState)
        {
          if(document.images)
          {
            document.images[iName].src = eval(iName + '_' + iState + '.src');
          }
        }
    
    </script>

  • #2
    Senior Coder coothead's Avatar
    Join Date
    Jan 2004
    Location
    chertsey, a small town 25 miles south west of london, england.
    Posts
    1,699
    Thanks
    0
    Thanked 233 Times in 228 Posts
    Hi there nailzfan,

    and a warm welcome to these forums.

    Try it like this...
    Code:
    
    <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
       "http://www.w3.org/TR/html4/strict.dtd">
    <html>
    <head>
    <!-- this is for coothead testing and can be removed -->
    <base href="http://nailzfan.gotdns.com/">
    
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
    <title>Untitled Document</title>
    
    <script type="text/javascript">
       var preloads=[];
       var ar,c;
    
    function preload(){
    for(c=0;c<arguments.length;c++) {
       preloads[preloads.length]=new Image();
       preloads[preloads.length-1].src=arguments[c];
      }
     }
    
    preload('background .gif','bg1.gif','bg2.gif','bg3.gif','bg4.gif');
    
    window.onload=function() {
       ar=document.getElementById('image_map').getElementsByTagName('area');
    for(c=0;c<ar.length;c++){
       ar[c].id=c+1;
       ar[c].onclick=function() {
       document.getElementById('DivExample').innerHTML=
    '<a href="http://www.google.com/" target="_blank">'+
    '<img src="bg1tiny.gif" alt="image1" >'+
    '<\/a>'; 
       return false;
     }
    
    ar[c].onmouseover=function() {
       document.getElementById('imagemap').src='bg'+this.id+'.gif';
     }
    
    ar[c].onmouseout=function() {
       document.getElementById('imagemap').src='background .gif';
       }
      }
     }
    </script> 
    
    <style type="text/css">
        body{
        background-color:#000;
     }
    img {
        border:0;
     }
    #imagemap {
        width:342px;
        height:379px;
        margin-left:12px;
     }
    #DivExample {
        position:absolute; 
        top:150px; 
        left:500px; 
        width:200px; 
        height:200px;;
     }
    </style>
    
    </head>
    <body>
    
    <div>
    
    <img src="background .gif" id="imagemap" usemap="#cube" alt="cube">
    
    <map name="cube" id="image_map">
     <area shape="rect" coords="3,58,163,230" href="#"  alt="">
     <area shape="rect" coords="164,60,334,230" href="#" alt="">
     <area shape="rect" coords="4,229,163,376" href="#"  alt="">
     <area shape="rect" coords="164,229,334,375" href="#" alt="">
    </map>
    
    </div>
    
    <div id="DivExample"></div>
    
    </body>
    </html>
    
    coothead
    Last edited by coothead; 08-07-2008 at 01:51 PM.


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •