|
| |
|
|
fredecd
Posts: 312
Joined: 12/3/2003
From: Louisiana, USA
Status: offline
 |
Z-Index Question - 7/7/2005 15:41:58
I am using the SEO Consultants CSS Drop Down Menu. I cannot seem to get the menu to cover up my form drop down boxes. I have tried assigning classes to my drop down boxes and increasing my z-index value for my menu items, but nothing has worked so far.
Any Ideas??
_____________________________
Chris
http://www.sightbysite.net
|
|
|
|
Tailslide
Posts: 5912
Joined: 5/10/2005
From: Out here on the raggedy edge
Status: offline
|
RE: Z-Index Question - 7/7/2005 15:52:13
You'll need to show us the code or provide a link for us to be sure.
Are you, by any chance using position:absolute for either element?
_____________________________
"My strategy is so simple an idiot could have devised it"
Little Blue Plane Web Design | Blood, Sweat & Rust - A Land Rover restoration project
| |
|
|
|
fredecd
Posts: 312
Joined: 12/3/2003
From: Louisiana, USA
Status: offline
|
RE: Z-Index Question - 7/7/2005 15:55:44
Yes. It looks like there is some absolute positioning involved. Here is the CSS for the Menu Layout:
/* CSS Menus - Horizontal CSS Menu with Dropdown and Popout Menus - 20050131 */
/**************** menu coding *****************/
#menu { background-color: #eee; background-repeat: repeat; background-attachment:
scroll; float: left; background-position: 0% }
#menu ul {
list-style: none;
margin: 0;
padding: 0;
width: 12em;
float: left;
z-index: 500;
}
#menu a, #menu h2 {
font: bold 11px/16px arial, helvetica, sans-serif;
display: block;
border-width: 1px;
border-style: solid;
border-color: #ccc #888 #555 #bbb;
margin: 0;
padding: 2px 3px;
z-index: 500;
}
#menu h2 {
color: #fff;
background: #0055AF;
text-transform: uppercase;
z-index: 500;
}
#menu a {
color: #000;
background: #efefef;
text-decoration: none;
z-index: 500;
}
#menu a:hover {
color: #0055AF;
background: #fff;
z-index: 500;
}
#menu li {position: relative;}
#menu ul ul {
position: absolute;
z-index: 500;
}
#menu ul ul ul {
position: absolute;
top: 0;
left: 100%;
z-index: 500;
}
div#menu ul ul,
div#menu ul li:hover ul ul,
div#menu ul ul li:hover ul ul
{display: none;}
div#menu ul li:hover ul,
div#menu ul ul li:hover ul,
div#menu ul ul ul li:hover ul
{display: block;
z-index: 500;}
/* End CSS Popout Menu */
_____________________________
Chris
http://www.sightbysite.net
| |
|
|
|
Tailslide
Posts: 5912
Joined: 5/10/2005
From: Out here on the raggedy edge
Status: offline
|
RE: Z-Index Question - 7/7/2005 16:12:20
I haven't used this particular menu system before - I know C1sissy has and could probably sort this out in about 3 seconds!
While we wait for her to show up could you post all of your HTML page code - it's easier to play with it and spot problems if you've got the lot.
_____________________________
"My strategy is so simple an idiot could have devised it"
Little Blue Plane Web Design | Blood, Sweat & Rust - A Land Rover restoration project
| |
|
|
|
fredecd
Posts: 312
Joined: 12/3/2003
From: Louisiana, USA
Status: offline
|
RE: Z-Index Question - 7/7/2005 16:25:30
Here is the main page:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html >
<head>
<title>Convent Refinery Overtime / Proficiency Web Site</title>
<link rel="stylesheet" type="text/css" media="print" href="print.css" />
<link rel="stylesheet" type="text/css" href="proficiency.css">
<style type="text/css" media="screen">body{behavior:url(csshover.htc);</style>
<style type="text/css" media="screen">
font-size: 100%;
}
#menu ul li {float: left; width: 100%;}
#menu ul li a {height: 1%;}
#menu a, #menu h2 {
font: bold 0.7em/1.4em arial, helvetica, sans-serif;
}
</style>
</head>
<body>
<div id="menu">
<!--#include file="prof_menu.htm"-->
</div>
<div id="content">
<form METHOD="POST" action="--WEBBOT-SELF--" onsubmit="return FrontPage_Form1_Validator(this)" name="FrontPage_Form1">
<!--webbot bot="SaveDatabase" startspan SuggestedExt="asp"
S-DataConnection="proficiency" S-RecordSource="tblHours"
U-Database-URL="../fpdb/proficiency.mdb"
S-Form-Fields="strUserName memComments numTD strException jobID strOvertime strCode numMeals dtDate opID numWorked"
S-Form-DBFields="strUserName memComments numTD strException jobID strOvertime strCode numMeals dtDate opID numWorked"
U-ASP-Include-Url="../_fpclass/fpdbform.inc" --><input TYPE="hidden" NAME="VTI-GROUP" VALUE="0"><!--#include file="../_fpclass/fpdbform.inc"--><!--webbot
bot="SaveDatabase" endspan -->
<table BORDER="0">
<tr>
<td><b>Date:</b></td>
<td><b><!--webbot bot="Validation" B-Disallow-First-Item="TRUE" --><select size="1" name="dtDate" class="hidebox">
<option>Select Date</option>
<option><%=Date()-1%></option>
<option><%=Date()%></option>
</select></b></td>
</tr>
<tr>
<td><b>Employee:</b></td>
<td><!--#include file="../_fpclass/fpdblib.inc"-->
<%
fp_sQry="SELECT * FROM tblOperators WHERE SeniorityGroupID=::SeniorityGroupID::"
fp_sDefault=""
fp_sNoRecords="No records returned."
fp_sDataConn="proficiency"
fp_iMaxRecords=256
fp_iCommandType=1
fp_iPageSize=0
fp_fTableFormat=False
fp_fMenuFormat=True
fp_sMenuChoice="strLastName"
fp_sMenuValue="opID"
fp_iDisplayCols=6
fp_fCustomQuery=False
BOTID=0
fp_iRegion=BOTID
%>
<select NAME="opID" SIZE="1" class="hidebox">
<option>Select a Name</option>
<!--#include file="../_fpclass/fpdbrgn1.inc"-->
<option VALUE="<%=FP_FieldHTML(fp_rs,"opID")%>"><%=FP_FieldHTML(fp_rs,"strLastName")%>,
<%=FP_FieldHTML(fp_rs,"strFirstName")%></option>
<!--#include file="../_fpclass/fpdbrgn2.inc"-->
</select></td>
</tr>
<tr>
<td><b>Job Section:</b></td>
<td><nobr><!--#include file="../_fpclass/fpdblib.inc"-->
<%
fp_sQry="SELECT * FROM tblJobSections WHERE SeniorityGroupID=::SeniorityGroupID::"
fp_sDefault=""
fp_sNoRecords="No records returned."
fp_sDataConn="proficiency"
fp_iMaxRecords=256
fp_iCommandType=1
fp_iPageSize=0
fp_fTableFormat=False
fp_fMenuFormat=True
fp_sMenuChoice="strJobSection"
fp_sMenuValue="jobID"
fp_iDisplayCols=6
fp_fCustomQuery=False
BOTID=0
fp_iRegion=BOTID
%>
<select NAME="jobID" SIZE="1">
<!--#include file="../_fpclass/fpdbrgn1.inc"-->
<option VALUE="<%=FP_FieldHTML(fp_rs,"jobID")%>"><%=FP_FieldHTML(fp_rs,"strJobDescription")%></option>
<!--#include file="../_fpclass/fpdbrgn2.inc"-->
</select>
</nobr></td>
</tr>
<tr>
<td><b>Worked:</b></td>
<td><input NAME="numWorked" SIZE="4" VALUE="<%=FP_FieldHTML(fp_rs,"numWorked")%>"></td>
</tr>
<tr>
<td><b>Turned Down:</b></td>
<td><input NAME="numTD" SIZE="4" VALUE="<%=FP_FieldHTML(fp_rs,"numTD")%>"></td>
</tr>
<tr>
<td><b>Overtime:</b></td>
<td><!--webbot bot="Validation" B-Disallow-First-Item="TRUE" --><select size="1" name="strOvertime">
<option>Overtime?</option>
<option>No</option>
<option>Yes</option>
</select></td>
</tr>
<tr>
<td><b>Exception:</b></td>
<td><!--webbot bot="Validation" B-Disallow-First-Item="TRUE" --><select size="1" name="strException">
<option>Exception?</option>
<option>No</option>
<option>Yes</option>
</select></td>
</tr>
<tr>
<td><b>Meals:</b></td>
<td><input NAME="numMeals" SIZE="4" VALUE="<%=FP_FieldHTML(fp_rs,"numMeals")%>"></td>
</tr>
<tr>
<td><b>Code:</b></td>
<td><!--webbot bot="Validation" B-Disallow-First-Item="TRUE" --><select size="1" name="strCode">
<option>Select a Reason Code</option>
<option>N/A - Not an absence</option>
<option>U0 - Absence - Medical</option>
<option>U1 - Absence - Vacation</option>
<option>U2 - Absence - Other</option>
<option>U3 - Training - Compliance</option>
<option>U4 - Training - HS&E</option>
<option>U5 - Training - Work Skills</option>
<option>U6 - Meeting - HS&E</option>
<option>U7 - Meeting - Company</option>
<option>U8 - Meeting - Union</option>
<option>U9 - Special Assignment</option>
<option>UA - Facility Problems</option>
<option>UB - Planned Maint. Work</option>
<option>UC - Project Work</option>
<option>UD - Natural Disaster</option>
<option>UE - Business Discretion</option>
</select></td>
</tr>
<tr>
<td><b>Comments:</b></td>
<td><textarea rows="5" name="memComments" cols="55"></textarea></td>
</tr>
<tr>
<td COLSPAN="2"><br>
<input TYPE="Submit" NAME="fp_submit"><input TYPE="Reset" NAME="fp_reset"></td>
</tr>
</table>
<input type="hidden" name="strUserName" value="<%=Request.ServerVariables("LOGON_USER")%>">
</form>
</div>
</body>
</html>
And here is the include:
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
<meta name="GENERATOR" content="Microsoft FrontPage 4.0">
<meta name="ProgId" content="FrontPage.Editor.Document">
<title>New Page 1</title>
</head>
<body>
<ul>
<li><h2>Overtime</h2>
<ul><li><a href="#">Volunteer</a></li>
<ul><!--#include file="../_fpclass/fpdblib.inc"-->
<%
fp_sQry="SELECT * FROM tblSeniorityGroup"
fp_sDefault=""
fp_sNoRecords="No records returned."
fp_sDataConn="proficiency"
fp_iMaxRecords=256
fp_iCommandType=1
fp_iPageSize=0
fp_fTableFormat=False
fp_fMenuFormat=False
fp_sMenuChoice=""
fp_sMenuValue=""
fp_iDisplayCols=2
fp_fCustomQuery=False
BOTID=0
fp_iRegion=BOTID
%>
<!--#include file="../_fpclass/fpdbrgn1.inc"-->
<li><a href="volunteer.asp?SeniorityGroupID=<%=FP_FieldVal(fp_rs,"SeniorityGroupID")%>"><%=FP_FieldVal(fp_rs,"strSeniorityGroup")%></a></li>
<!--#include file="../_fpclass/fpdbrgn2.inc"-->
</ul>
<li><a href="#">Get A List</a></li>
<ul><!--#include file="../_fpclass/fpdblib.inc"-->
<%
fp_sQry="SELECT * FROM tblSeniorityGroup"
fp_sDefault=""
fp_sNoRecords="No records returned."
fp_sDataConn="proficiency"
fp_iMaxRecords=256
fp_iCommandType=1
fp_iPageSize=0
fp_fTableFormat=False
fp_fMenuFormat=False
fp_sMenuChoice=""
fp_sMenuValue=""
fp_iDisplayCols=2
fp_fCustomQuery=False
BOTID=0
fp_iRegion=BOTID
%>
<!--#include file="../_fpclass/fpdbrgn1.inc"-->
<li><a href="otsearch.asp?SeniorityGroupID=<%=FP_FieldVal(fp_rs,"SeniorityGroupID")%>"><%=FP_FieldVal(fp_rs,"strSeniorityGroup")%></a></li>
<!--#include file="../_fpclass/fpdbrgn2.inc"-->
</ul>
</ul>
</li>
</ul>
<ul>
<li><h2>Proficiency</h2>
<ul><li><a href="#">Proficiency Lists</a></li>
<ul><!--#include file="../_fpclass/fpdblib.inc"-->
<%
fp_sQry="SELECT * FROM tblSeniorityGroup"
fp_sDefault=""
fp_sNoRecords="No records returned."
fp_sDataConn="proficiency"
fp_iMaxRecords=256
fp_iCommandType=1
fp_iPageSize=0
fp_fTableFormat=False
fp_fMenuFormat=False
fp_sMenuChoice=""
fp_sMenuValue=""
fp_iDisplayCols=2
fp_fCustomQuery=False
BOTID=0
fp_iRegion=BOTID
%>
<!--#include file="../_fpclass/fpdbrgn1.inc"-->
<li><a href="proficiency_form.asp?SeniorityGroupID=<%=FP_FieldVal(fp_rs,"SeniorityGroupID")%>"><%=FP_FieldVal(fp_rs,"strSeniorityGroup")%></a></li>
<!--#include file="../_fpclass/fpdbrgn2.inc"-->
</ul>
</ul>
</li>
</ul>
</body>
</html>
_____________________________
Chris
http://www.sightbysite.net
| |
|
|
|
Tailslide
Posts: 5912
Joined: 5/10/2005
From: Out here on the raggedy edge
Status: offline
|
RE: Z-Index Question - 7/7/2005 16:41:45
Hmmm - I think bobby's right, drop-down boxes have an infinite z-index in IE so they'll always show through. I think there are ways round it but it would involve lots of JS coding which might make your life hard in the long run.
Could you go for the "moving it down the page" option?
_____________________________
"My strategy is so simple an idiot could have devised it"
Little Blue Plane Web Design | Blood, Sweat & Rust - A Land Rover restoration project
| |
|
|
|
fredecd
Posts: 312
Joined: 12/3/2003
From: Louisiana, USA
Status: offline
|
RE: Z-Index Question - 7/13/2005 12:03:08
Update:
Found a site that uses <iframe> to position an inline transparent frame over the select boxes so that they don't bleed through.
DotNet Junkies
The only problem is that I cannot get the transparency to work for me in the <iframe>. It either blocks out the select boxes completely, or it lets them bleed through, depending on the opacity settings. The site claims that I can use the "Display:none;" style, but it does not block the select boxes when I use that setting.
I will continue to work on this in my spare time, but am giving up on aggressively seeking a solution.
Also found a working Javascript menu on Milonic.com, but was looking to get away from a Javascript menu.
Later,
_____________________________
Chris
http://www.sightbysite.net
| |
|
 New Messages |
 No New Messages |
 Hot Topic w/ New Messages |
 Hot Topic w/o New Messages |
 Locked w/ New Messages |
 Locked w/o New Messages |
|
Post New Thread
Reply to Message
Post New Poll
Submit Vote
Delete My Own Post
Delete My Own Thread
Rate Posts
|
|
|
Printable Version 
