Solved

How do I bring the drop down menu to most front ?

Posted on 2010-09-06
5
769 Views
Last Modified: 2012-06-27
Hi experts,

I followed the tutorial at http://www.webdesign.org/web-programming/javascript/sliding-jquery-menu.17229.html  to get a drop down menu.

However I tried to make a table/content in front but the drop down menu seens opens behind the table. Can anyone teach me how to get drop downs menu to the front? for example: the log in drop down menu for site? Thanks :)

Regards
Aaxen
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Sliding Menu Tutorial | HV-DESIGNS.CO.UK</title>
<link href="style.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript" src="slider.js"></script>

</head>

<body>
<div id="container">
<div id="header">
</div>

<div id="button">
<img src="image/btnhome.jpg" width="184" height="32" border="0" class="menu_class" />
<ul class="the_menu">
<li><a href="#">A Website #1</a></li>
<li><a href="#">A Website #2</a></li>
<li><a href="#">A Link #1</a></li>
<li><a href="#">A Link #2</a></li>
<li><a href="#">A Website #3</a></li>
<li><a href="#">A Website #4</a></li>
<li><a href="#">A Link #3</a></li>
<li><a href="#">A Link #4</a></li>

</ul>

</div>
</div>
<table border="0" cellpadding ='0' cellspacing ='0' align =center  id="table1">
<tr><td style='background-color: #FFFFFF;' height="95" valign = 'top'>This is Not a drill</td></tr></table>
</body>
</html>

Open in new window

0
Comment
Question by:aaxen
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
  • 3
  • 2
5 Comments
 
LVL 13

Expert Comment

by:ansudhindra
ID: 33615402
Hi,

Just replace the below line
<ul class="the_menu" style="position:absolute;z-index:1;">
with <ul class="the_menu">

I tested it is working fine.
0
 
LVL 13

Accepted Solution

by:
ansudhindra earned 500 total points
ID: 33615405
Oh! Sorry,

Replace the line
<ul class="the_menu"> with the line
<ul class="the_menu" style="position:absolute;z-index:1;">

Sorry, ignore my previous post.
0
 

Author Comment

by:aaxen
ID: 33615482
ahh cool works shows to front. just that the list opens from side instead of below the img
0
 

Author Comment

by:aaxen
ID: 33615491
aah nvm got it :P Thanks
0
 
LVL 13

Expert Comment

by:ansudhindra
ID: 33615505
you got it resolved or you still have some problem?
0

Featured Post

Independent Software Vendors: We Want Your Opinion

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Suggested Solutions

Title # Comments Views Activity
Understanding ping command in Ubuntu 5 64
Can anyone help me find this preloader? 51 67
modify font on ninja form 1 25
carousel control extend past the images 9 27
As a result of several questions about how to use Bootstrap I thought it would be a good idea to write down the development aspect of creating a Bootstrapped website in as little time as possible. Part 1 of this article will only concentrate on g…
CSS is a visual language used to classify objects and define rules about how they should be displayed. CSS skills aren’t restricted to developers anymore, there is a big benefit to having a basic understanding of the language, regardless of your occ…
In this tutorial viewers will learn how to style a corner ribbon overlay for an image using CSS Create a new class by typing ".Ribbon":  Define the class' "display:" as "inline-block": Define its "position:" as "relative": Define its "overflow:" as …
In this tutorial viewers will learn how to style different bullet points for unordered lists in CSS. Begin with a normal unordered list; the default bullet point is a solid circle: In the CSS, create a defined class of unordered list by typing "ul.S…

739 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question