Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

Register Log in
  • Congratulations strongm on being selected by the Tek-Tips community for having the most helpful posts in the forums last week. Way to Go!

netscape layer problem

Status
Not open for further replies.
dustyfido

dustyfido

IS-IT--Management
Oct 1, 2000
12
US
i have a floating navigation bar whose functionality is to float over the page whose content would consist of a form and form elemetns like radio buttons..
the radio buttons are punching through the layer space
has anybody seen this behaviour before..please advise
<!-- code begin -->
<html>
<head>
<style>
.spanstyle {
position:absolute;
visibility:visible;
top:-50px;
font-size:10pt;
font-family:Verdana;
font-weight:bold;
color:black;
background:pink ;
background-color:pink;
layer-background-color:pink;
z-index:100;
}
.radiostyle
{
position:static;
visibility:visible;
top:-50px;
font-size:10pt;
font-family:Verdana;
font-weight:bold;
color:black;
background-color:pink;
layer-background-color:red;
z-index:1;
background : #FFCC00;
}
</style>
<script>
var junk = 50;
function handleNavBar()
{
if(document.all)
{
var thisspan = eval(&quot;span&quot;+&quot;1&quot;+&quot;.style&quot;)
thisspan.posLeft=0 ;
thisspan.posTop=document.body.scrollTop ; //y ;
setTimeout(&quot;handleNavBar()&quot;,10) ;
}
if(document.layers)
{
var thisspan = eval(&quot;document.span&quot;+&quot;1&quot;) ;
thisspan.left = 0 ;
thisspan.top = window.pageYOffset + 55 ;


// document.span2.visibility = &quot;hide&quot; ;
// var otherspan = eval(&quot;document.span&quot;+&quot;2&quot;) ;
// thisspan.zIndex = 0;
// otherspan.zIndex = 1 ;


/////// ch=document.body.clientHeight;
// alert(document.body.clientWidth) ;

// window.document.layers['span1'].moveAbove(window.document.layers['span2']) ;
// window.document.layers['span2'].moveBelow(window.document.layers['span1']) ;




setTimeout(&quot;handleNavBar()&quot;,10) ;
//window.setinterval(handleNavBar(),5000) ;

}
}
function listboxclickhandle()
{
if(document.layers)
{
var thisobj = eval(&quot;document.span1.document.form1.SalesNames&quot;) ;
//thisobj.layers[0].src = &quot;<form name='form1'><SELECT Name='SalesNames' onchange='listboxclickhandle()'><OPTION Value='one'>one<OPTION Value='vikram'>kumeta<OPTION Value='Rick'>Rick<OPTION Value='Kevin'>Kevin</Select> <table border='0' width='95%' cellspacing='0' cellpadding='0' bgcolor=yellow><tr><td>VIKRAM KUMETA</td></tr></table></form>&quot; ;
// thisobj[thisobj.length] = new option(&quot;junk&quot;) ;
// thisobj[thisobj.length-1].value = &quot;junk&quot;;
//thisobj[thisobj.length-1].text = &quot; junk &quot; ;
thisobj[0].value = &quot;vikram&quot; ;
thisobj[0].text=&quot;vikram&quot; ;
alert(thisobj) ;
}

}

function imgClickHandle(index)
{
alert(index) ;
}
</script>

<span id=span1 name=span1 class=&quot;spanstyle&quot;>
<form name=&quot;form1&quot; id=&quot;form1&quot; >
<SELECT Name=&quot;SalesNames&quot; onchange=&quot;listboxclickhandle()&quot;>
<OPTION Value=&quot;Jeff&quot;>Jeff
<OPTION Value=&quot;Charles&quot;>Charles
<OPTION Value=&quot;Rick&quot;>Rick
<OPTION Value=&quot;Kevin&quot;>Kevin
</Select>

<input type = button name = &quot; junk &quot; value = &quot; junk &quot; onclick=&quot;listboxclickhandle()&quot;>
<table border=&quot;0&quot; width=&quot;100%&quot; cellspacing=&quot;0&quot; cellpadding=&quot;0&quot;>

<tr><td colspan=&quot;23&quot;>
<table cellpadding=&quot;0&quot; cellspacing=&quot;0&quot;>
<tr><td><img src=&quot;images/loinctotesttitle1.gif&quot;></td>
<td width=&quot;80%&quot; background=&quot;images/titleline.gif&quot;>&nbsp</td>
<td width=&quot;10%&quot;><img NAME=&quot;LOINCLIST&quot; src = &quot;images/selectloincblk.gif&quot; border=0></img></a></td>
</tr>
</table> </td>
</tr>

<tr>
<td width=&quot;5%&quot;><font face = &quot;Times New Roman&quot; size = 1><b>SELECT</b></font></td>
<td width=&quot;1%&quot;><font face = &quot;Times New Roman&quot; size = 1><b>|</b></font></td>
<td width=&quot;7%&quot;><font face = &quot;Times New Roman&quot; size = 1><b>KEYWORD</b></font></td>
<td width=&quot;1%&quot;><font face = &quot;Times New Roman&quot; size = 1><b>|</b></font></td>
<td width=&quot;7%&quot;><font face = &quot;Times New Roman&quot; size = 1><b></b></font>
<img name=&quot;image1&quot; src=&quot;images/sortby_white.gif&quot;>
</td>
<td width=&quot;1%&quot;><font face = &quot;Times New Roman&quot; size = 1><b>|</b></font></td>
<td width=&quot;13%&quot;><font face = &quot;Times New Roman&quot; size = 1><b></b></font>
<img name=&quot;image2&quot; src=&quot;images/sortby_white.gif&quot;>
</td>
<td width=&quot;1%&quot;><font face = &quot;Times New Roman&quot; size = 1><b>|</b></font></td>
<td width=&quot;8%&quot;><font face = &quot;Times New Roman&quot; size = 1><b>PROPERTY</b></font>
<img name=&quot;image3&quot; src=&quot;images/sortby_white.gif&quot;>
</td>
<td width=&quot;1%&quot;><font face = &quot;Times New Roman&quot; size = 1><b>|</b></font></td>
<td width=&quot;4%&quot;><font face = &quot;Times New Roman&quot; size = 1><b>TIME</b></font></td>
<td width=&quot;1%&quot;><font face = &quot;Times New Roman&quot; size = 1><b>|</b></font></td>

<td width=&quot;6%&quot;><font face = &quot;Times New Roman&quot; size = 1><b>SYSTEM</b></font></td>
<td width=&quot;1%&quot;><font face = &quot;Times New Roman&quot; size = 1><b>|</b></font></td>
<td width=&quot;4%&quot;><font face = &quot;Times New Roman&quot; size = 1><b>SCALE</b></font></td>
<td width=&quot;1%&quot;><font face = &quot;Times New Roman&quot; size = 1><b>|</b></font></td>

<td width=&quot;6%&quot;><font face = &quot;Times New Roman&quot; size = 1><b>METHOD</b></font></td>
<td width=&quot;1%&quot;><font face = &quot;Times New Roman&quot; size = 1><b>|</b></font></td>
<td width=&quot;11%&quot;><font face = &quot;Times New Roman&quot; size = 1><b>RELATED NAMES</b></font></td>
<td width=&quot;1%&quot;><font face = &quot;Times New Roman&quot; size = 1><b>|</b></font></td>

<td width=&quot;3%&quot;><font face = &quot;Times New Roman&quot; size = 1><b>CLASS</b></font></td>
<td width=&quot;1%&quot;><font face = &quot;Times New Roman&quot; size = 1><b>|</b></font></td>
<td width=&quot;8%&quot;><font face = &quot;Times New Roman&quot; size = 1><b>TYPE</b></font></td>
<tr><td colspan=&quot;23&quot; background=&quot;images/titleline.gif&quot;>&nbsp</td></tr>
</table>

</form>

</span>


</head>
<body onLoad=&quot;handleNavBar()&quot;>



<!-- <layer id=span2 name=span2 class=&quot;radiostyle&quot;> -->
<form name =&quot;junk&quot;>
<!-- <br><input type = radio name=&quot;junk1&quot; value= &quot;junk1&quot; style=&quot;background : #FFCC00; color : black; z-index : 100;&quot;> -->
<br><input type = radio name=&quot;junk1&quot; value= &quot;junk1&quot; class=&quot;radiostyle&quot;>
<!-- <br><input type = text name = &quot;junktext&quot; length=34 style=&quot;float:left&quot;> -->
<br><input type = radio name=&quot;junk1&quot; value= &quot;junk1&quot; class=&quot;radiostyle&quot;>
<br><input type = radio name=&quot;junk1&quot; value= &quot;junk1&quot; class=&quot;radiostyle&quot;>
<br><input type = radio name=&quot;junk1&quot; value= &quot;junk1&quot; class=&quot;radiostyle&quot;>
<br><input type = radio name=&quot;junk1&quot; value= &quot;junk1&quot; class=&quot;radiostyle&quot;>
<br><input type = radio name=&quot;junk1&quot; value= &quot;junk1&quot; class=&quot;radiostyle&quot;>
<br><input type = radio name=&quot;junk1&quot; value= &quot;junk1&quot; class=&quot;radiostyle&quot;>
<br><input type = radio name=&quot;junk1&quot; value= &quot;junk1&quot; class=&quot;radiostyle&quot;>
<br><input type = radio name=&quot;junk1&quot; value= &quot;junk1&quot; class=&quot;radiostyle&quot;>
<br><input type = radio name=&quot;junk1&quot; value= &quot;junk1&quot; class=&quot;radiostyle&quot;>
<br><input type = radio name=&quot;junk1&quot; value= &quot;junk1&quot; class=&quot;radiostyle&quot;>
<br><input type = radio name=&quot;junk1&quot; value= &quot;junk1&quot; class=&quot;radiostyle&quot;>
<br><input type = radio name=&quot;junk1&quot; value= &quot;junk1&quot; class=&quot;radiostyle&quot;>
<br><input type = radio name=&quot;junk1&quot; value= &quot;junk1&quot; class=&quot;radiostyle&quot;>
<br><input type = radio name=&quot;junk1&quot; value= &quot;junk1&quot; class=&quot;radiostyle&quot;>
<br><input type = radio name=&quot;junk1&quot; value= &quot;junk1&quot; class=&quot;radiostyle&quot;>
<br><input type = radio name=&quot;junk1&quot; value= &quot;junk1&quot; class=&quot;radiostyle&quot;>
<br><input type = radio name=&quot;junk1&quot; value= &quot;junk1&quot; class=&quot;radiostyle&quot;>
<br><input type = radio name=&quot;junk1&quot; value= &quot;junk1&quot; class=&quot;radiostyle&quot;>
<br><input type = radio name=&quot;junk1&quot; value= &quot;junk1&quot; class=&quot;radiostyle&quot;>
<br><input type = radio name=&quot;junk1&quot; value= &quot;junk1&quot; class=&quot;radiostyle&quot;>
<br><input type = radio name=&quot;junk1&quot; value= &quot;junk1&quot; class=&quot;radiostyle&quot;>
<br><input type = radio name=&quot;junk1&quot; value= &quot;junk1&quot; class=&quot;radiostyle&quot;>
<br><input type = radio name=&quot;junk1&quot; value= &quot;junk1&quot; class=&quot;radiostyle&quot;>
<br><input type = radio name=&quot;junk1&quot; value= &quot;junk1&quot; class=&quot;radiostyle&quot;>
<br><input type = radio name=&quot;junk1&quot; value= &quot;junk1&quot; class=&quot;radiostyle&quot;>
<br><input type = radio name=&quot;junk1&quot; value= &quot;junk1&quot; class=&quot;radiostyle&quot;>
<br><input type = radio name=&quot;junk1&quot; value= &quot;junk1&quot; class=&quot;radiostyle&quot;>
<br><input type = radio name=&quot;junk1&quot; value= &quot;junk1&quot; class=&quot;radiostyle&quot;>
<br><input type = radio name=&quot;junk1&quot; value= &quot;junk1&quot; class=&quot;radiostyle&quot;>
<br><input type = radio name=&quot;junk1&quot; value= &quot;junk1&quot; class=&quot;radiostyle&quot;>
<br><input type = radio name=&quot;junk1&quot; value= &quot;junk1&quot; class=&quot;radiostyle&quot;>
</form>
<!-- </layer> -->
</body>
</html>
<!-- code end -->
 
Sort by date Sort by votes
Hello,

I have had this exact problem and have not been able to fix it. I was told that form elements are always top-level objects in Nutscape so get used to it.

A possible workaround to this problem is to set the annoying form elements in their own layer and set its visibility to hidden when needed. I have never tried this so I don't know if it works.

Otherwise try not to put forms under layers.

Does any body else have solutions to this problem? It would surely help us out!

-Petey
 
Upvote 0 Downvote
Yep - you can show and hide form elements if you like. The only way to stop this happening.;-)
b[sup]2[/sup] - benbiddington@surf4nix.com
 
Upvote 0 Downvote
I am not a programmer but a beginner. I am working with dreamweaver and am trying to get a disjointed rollover to work with layers-show/ hide, between a flash button and an image- so far it only works in IE and AOL. will it work somehow in netscape? thanks for any help. Richard
 
Upvote 0 Downvote
i have been able to fix it by having each row in its own span and capturing the scroll bar offset..but its a tedious and non scalable approach..if anybody has any other ideas..would love to hear them..
i have not seen netscape 6 yet..does it have the same constraints?
man!!!! i am getting tired of netscape...why can't they get along with every body else :(
 
Upvote 0 Downvote
Netscape 6 is a mixed bag, I think. They have made a lot of giant steps forward with the new browser, but over all it is a real dog. Many people have complained that their sites, which have worked fine on all other browsers, render poorly in N6. We are all hoping they will get their act together soon.

Off the top of my head, I think the command to hide an element is:
Code: 
document.elementName.visibility = &quot;hide&quot;;
But you may want to double check that.

A function that works in NN and IE would look like:
Code: 
if (navigator.appName.indexOf(&quot;Microsoft&quot;) != -1)
var hide = function(elementName) { document.all[elementName].style.visibility = &quot;hidden&quot;; }

if (navigator.appName.indexOf(&quot;Netscape&quot;) != -1)
var hide = function(elementName) { document[elementName].visibility = &quot;hidden&quot;; }

-Petey
 
Upvote 0 Downvote
Status
Not open for further replies.

Similar threads

amrmnabil
  • Locked
  • Question
React Problem
Replies
0
Views
132
amrmnabil
amrmnabil
bs6600
  • Locked
  • Question
Nested accordion problem
Replies
1
Views
91
bs6600
bs6600
Disskyz
  • Locked
  • Question
New to JavaScript, Having a problem with an array
Replies
2
Views
137
Disskyz
Disskyz
bs6600
  • Locked
  • Question
Accordion - Anchors in panels causing problems 1
Replies
6
Views
135
feherke
feherke
Michael Davis
  • Locked
  • Question
Robert.Husted Calendar Script Problem?
Replies
2
Views
86
Michael Davis
Michael Davis

Part and Inventory Search

Sponsor

Back
Top