Hey there,
I've been trying to create a hover menu in an already existing html page and i'm having trouble getting it working. I've gone through a bunch of posts and other web tutorials and every time I integrate the <li> <ul> stuff, my page breaks. Basically I'm trying to do a hover menu over the word "galley" so that when the user hovers over the word, a drop down menu comes down which will allow them to choose which galley they want to view. In the end, I'll have it so when they hover over the name of one of the galleries in the drop-down, it will turn a different color, but in general, is there something inherent in this already existing page that will break the page when I try to do a hover menu?
Thanks very much in advance!
Dave
this is a stripped down version of the original webpage:
<html>
<head>
<!-- © COPYRIGHT -->
<body bgcolor="#ffffff" marginwidth="0" marginheight="0" topmargin="0">
<table width="100%" height="100%" cellspacing="0" cellpadding="0" border="0">
<tr><td align="center" valign="top">
<!-- ******* BLACK TITLE BAR ******* -->
<table width="100%" height="49" bgcolor="#000000" cellspacing="0" cellpadding="0">
<tr><td align="center">
<img border="0" src="images/title_bar.gif">
</td>
</tr>
</table>
<!-- ******* PHOTO TITLE BAR ******* -->
<table width="100%" cellspacing="0" cellpadding="0">
<tr><td align="center">
<img border="0" src="images/photography_titlebar.gif">
</td></tr>
</table>
<!-- DIVIDER -->
<table width="100%" cellspacing="0" cellpadding="0" border="0">
<tr><td height="5" align="center" valign="middle" background="images/dot_pattern.gif"> </td></tr>
</table>
<!-- ******* MENU ******* -->
<table cellpadding="0" cellspacing="0" border="0" height="20">
<tr>
<td class="menu_padding" valign="top" align="center">
<a class="main_menu" href="index.html">HOME</a>
</td>
<td valign="top" align="center"> | </td>
<td class="menu_padding" valign="top" align="center">
<a class="main_menu" href="gallery_weddings_1a.html">GALLERY</a>
</td>
<td valign="top" align="center"> | </td>
<td class="menu_padding" valign="top" align="center">
<a class="main_menu" href="about_us_bio.html">ABOUT US</a>
</td>
<td valign="top" align="center"> | </td>
<td class="menu_padding" valign="top" align="center">
<a class="main_menu" href="packages.html">PACKAGES</a>
</td>
<td valign="top" align="center"> | </td>
<td class="menu_padding" valign="top" align="center">
<a class="main_menu" href="contact_us.html">CONTACT US</a>
</td>
<td valign="top" align="center"> | </td>
<td align="center" valign="top"> | </td>
<td valign="top" align="center"> | </td>
<td class="menu_padding" valign="top" align="center">
</td>
</tr>
</tbody></table>
<!-- DIVIDER -->
<table width="100%" cellspacing="0" cellpadding="0">
<tr><td height="5" align="center" valign="middle" background="images/dot_pattern.gif"> </td></tr>
</table>
<!-- ****** CONTENT ****** -->
<table width="1024" cellspacing="0" cellpadding="0" border="0" bgcolor="#ffffff">
<!--<tr>
<td valign="middle" colspan="4">
<div id="menu_aboutus">
<a href="testimonials_1_keri.html">TESTIMONIALS</a><br>
<a href="about_us_bio.html">BIO</a>
</div>
</td>
</tr>-->
<tr>
<td width="33%" valign="top" align="right">
</td>
<td width="33%" valign="top" align="center">
<img src="images/home_splash.jpg" border="0"><br><br>
</td>
<td width="33%" valign="bottom" align="right">
<img src="images/dot_vertical_rightsash.gif" border="0">
</div>
</td>
</tr>
</table>
<!-- ******* FOOTERS ******* -->
<table width="100%" cellpadding="0" cellspacing="0" border="0">
<tr>
<td align="center" height="26" background="images/footer_pattern_line.gif">
<img src="images/footer2010.gif" border="0" usemap="#Map"> </td>
</tr>
<tr>
<td align="center" height="12" background="images/footer_pattern_dot.gif">
</td>
</tr>
</table>
<!-- ******** END LAYOUT ********* -->
<br>
</td></tr></table>
Full Version: Hover Menu Help
Something like this perhaps?
http://meyerweb.com/eric/css/edge/menus/demo.html
http://meyerweb.com/eric/css/edge/menus/demo.html
QUOTE(Darin McGrew @ May 26 2012, 01:10 PM) 
Thanks much for the reply Darin. Every time I try to integrate the <li> <ul> stuff, the formatting of my page breaks. I'm a newbie, so I wasn't sure if I could even use that method with the way the current page has been built. So I guess it's kind of a basic question, that maybe you're answering. I think you're saying yes, the way your page has been built, you can use <li> <ul> to create those drop-down menus. Yeah? For some reason, every time I insert that into my page, the formatting goes to hell and my drop down menu ends up along the left hand side of the page. But, like I said, I'm a newbie, so maybe I just need to keep at it.
Thanks again.
Oops! Posted in the wrong thread. 
This is a "lo-fi" version of our main content. To view the full version with more information, formatting and images, please click here.