Problem in Netscape

Hi,

I have one image which will be moving along with the scorll. And a text Box at the Bottom. As I Scroll Down The Image will appear in front of the text Box. But In Netscape it is not possible The Image will be Behind the textBox.

I have one sample File uploaded.

http://kq.cuttack.net/ravi/ 

Pls scroll down and view.

Is it possible in Netscape also to view same as IE
ravimkAsked:
Who is Participating?
 
tleishConnect With a Mentor Commented:
Webreference.com gives a good explanation of what doesn't work with objects on the page and layers:
http://www.webreference.com/dhtml/diner/seethru/

The only solution I've ever seen when this has to be used it to put the form element in a layer, and hide it whenever the 2nd layer would be covering it.

Here's an example from FAQTS.com, view it in NS to see what I mean:

<!------- BEGIN CODE --------->
<HTML>
<HEAD>
<STYLE>
.javascript { color: white; background-color: orange; }
.php { color: white; background-color: darkblue; }
.python { color: white; background-color: lightblue; }
#layer1 {
  position: absolute;
  z-index: 10;
  left: 50px;
  visibility: hidden;
}
#layer2 {
  position: absolute;
  z-index: 5;
  left: 0px;
}
</STYLE>
<SCRIPT>
function showLayer (id) {
  if (document.layers)
    document[id].visibility = 'show';
  else if (document.all)
    document.all[id].style.visibility = 'visible';
  else if (document.getElementById)
    document.getElementById(id).style.visibility = 'visible';
}
function hideLayer (id) {
  if (document.layers)
    document[id].visibility = 'hide';
  else if (document.all)
    document.all[id].style.visibility = 'hidden';
  else if (document.getElementById)
    document.getElementById(id).style.visibility = 'hidden';
}
function clipSelect () {
  if (document.layers) {
    document.layer2.oldClipWidth = document.layer2.document.width;
    document.layer2.clip.width = 50;
  }
  else if (document.all)
    document.all.layer2.style.clip = 'rect(auto 50px auto auto)';
}
function unclipSelect () {
  if (document.layers)
    document.layer2.clip.width = document.layer2.oldClipWidth;
  else if (document.all)
    document.all.layer2.style.clip = 'rect(auto auto auto auto)';
}
function init () {
  if (document.layers)
    document.layer1.onmouseout = function () {
      hideLayer(this.id);
      unclipSelect();
    };
}
</SCRIPT>
</HEAD>
<BODY ONLOAD="init()">
<A HREF="javascript: void 0"
   ONMOUSEOVER="showLayer('layer1'); clipSelect();">
Knowledge Bases
</A>
<BR>
<DIV ID="layer1"
     ONMOUSEOUT="if (document.all) {
                   if (!this.contains(event.toElement)) {
                     hideLayer(this.id);
                     unclipSelect();
                   }
                 }
                 else if (document.getElementById) {
                   window.tid = setTimeout('hideLayer(\'' + this.id
+ '\')', 20);
                 }"
     ONMOUSEOVER="if (document.getElementById)
                   clearTimeout(window.tid);"
>
<TABLE BORDER="0">
<TR>
<TD CLASS="javascript">
<A HREF="http://JavaScript.FAQTs.com" CLASS="javascript">
JavaScript.FAQTs.com
</A>
</TD>
</TR>
<TR>
<TD CLASS="php">
<A HREF="http://php.FAQTs.com" CLASS="php">
php.FAQTs.com
</A>
</TD>
</TR>
<TR>
<TD CLASS="python">
<A HREF="http://python.FAQTs.com" CLASS="python">
python.FAQTs.com
</A>
</TD>
</TR>
</TABLE>
</DIV>
<DIV ID="layer2">
<FORM NAME="formName">
<SELECT NAME="aSelect" WIDTH="150" STYLE="width: 150px;">
<OPTION>Kibo
<OPTION>Kibology
<OPTION>Xibology
</SELECT>
</FORM>
</DIV>
</BODY>
</HTML>
<!------- END CODE --------->
0
 
djbusychildCommented:
This is a known issue with NS. You cannot have anything on top of form widgets... sorry.. =(
0
 
CJ_SCommented:
Not only form-element, you can't place anything above a java-applet, flash and other elements which are not plain html. This is because these items have an infinite z-index which will make them appear in front of everything. You can hide the form-elements by putting them in a layer and make it visible or invisible at command, but it won't be pretty.

Regards,
CJ
0
 
djbusychildCommented:
well plugins and applets have their own graphics context, so the problem is there for both NS and IE. form elements reside in the same graphics context and the problem is only in NS
0
 
ravimkAuthor Commented:
Thanks for giving an Code and explaining the problem and giving the refrence for more info.
0
Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.

All Courses

From novice to tech pro — start learning today.