Browser problem

• • Reply

  12 years ago

  by Sucezvs

  Christophe Elson

  , France

  Joined 13 years ago

  Hello all i am trying to open a link  in my code.The problem the link works fine in IE ,but when I try to open the same in Firefox then there isn't any link detected.

  This is the piece of code where I am facing this problem

   

   <span id="openLogin" onclick="loginPanel1.style.visibility='visible'; document.getElementById('username').focus()" style="color:blue;cursor:hand">
    Researchers can login here.
    </span>

   

  Clicking on "Researchers can login here" opens a panel with username and password.But I am not able to access the link in Firefox.

  Anyone with any idea about this,please help me out.

   

  Thanks in advance

  -Sravani 

   

  Report abuse
• • Reply

  12 years ago

  by Thushan Fernando

  Thushan Fernando

  Australia :: Melbourne, Australia

  Joined 19 years ago

  Hello and welcome to DeveloperFusion.

  You need to abstract away the hiding and showing of layers in your code so its easier to manage as there are multiple ways of hiding/showing layers across browsers and depending on which browser the client is using you need to adapt to it.

  Here's a rough breakdown of the usage:

  • document.getElementById - DOM v3 (so Netscape 6, IE5+, Opera, Firefox etc)
    
  • document.layers - Netscape 4
    
  • document.all - IE4 (use as last resort)

  Thats just to return the DIV layer you want to hide/show. Then you can choose either to set the visibility property or the display property once you have the layer.
  

  You can do:

  • [layer].style.display = "none" | "inline" | "block"
    
  • [layer].style.visibility = "visible" | "hidden"

  So whats the difference?

  The visibility property will make the element hidden but it will still be apart of the document (there will be an empty space there), where as the display property removes that element completely from the document as if it was never there to begin with to render.

  Now that I've gone through the background, some code. Firstly in your onclick we should use call a function to handle all the hiding and showing of layers instead of putting code in there (its cleaner, and easier to manage). So you can call it say, 'showLayer' or something, and move that function into a seperate javascript file (scripts.js?) so you can easily reuse it and modify it later.

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

  On a side note, to detect the type of browser:

  var isIE = (document.all && window.external && window.ActiveXObject) ? true:false;
  var isInternetExplorer = (document.all && window.external && window.ActiveXObject) ? true:false;
  var isMozilla = true&&window.GeckoActiveXObject;
  var isOpera = true&&window.opera;
  var isNetscape4 = (document.layers) ? true:false 
  var isNetscapeGecko5 = (document.getElementById) ? true:false 
  var isOther = (!isIE&&!isMozilla&&!isOpera&&!isNetscape4&&!isNetscapeGecko5);

  Now to get the layer out:

  function getLayer(objLayer)
  {
      if (document.getElementById)
          return document.getElementById(objLayer);
      else if (document.all)
          return document.all[objLayer];
      else if (document.layers)
          return document.layers[objLayer];
  } 

  Once we have the layer you can use either visibility or display as mentioned above. To make your life easier, heres a full example:

  function showLayer(objLayer)
  {
    var layer = getLayer(objLayer)
    var username = getLayer('username');
    if(layer == null) return;
    layer.style.visibility = 'visible';
    if(username !=null) username.focus();
  }
  
  

  <span id="openLogin" onclick="BLOCKED SCRIPTshowLayer('loginPanel1');" style="color:blue;cursor:hand">
    Researchers can login here.
    </span>

  I hope that helps you understand the logic, however the code is untested, so if it doesn't render what you want I will fix it :-) I'm on vacation now in Japan but its raining so I figured I'd check the forums :-)
  

  Report abuse
• • Reply

  12 years ago

  by gabriel66

  Mena Gabriel

  , Egypt

  Joined 13 years ago

  Even I was facing the same issue in FF. Thanks for the info. !!

   

   Thanks Buddy !!

   
  

   

   

   

  Report abuse
• • Reply

  12 years ago

  by Sucezvs

  Christophe Elson

  , France

  Joined 13 years ago

  Thanks Mr.Fernando.It worked!!

   

  -Sravani 

  Report abuse