Jump to content

Search the Community

Showing results for tags 'menu'.

  • Search By Tags

    Type tags separated by commas.
  • Search By Author

Content Type


Forums

  • W3Schools
    • General
    • Suggestions
    • Critiques
  • HTML Forums
    • HTML/XHTML
    • CSS
  • Browser Scripting
    • JavaScript
    • VBScript
  • Server Scripting
    • Web Servers
    • Version Control
    • SQL
    • ASP
    • PHP
    • .NET
    • ColdFusion
    • Java/JSP/J2EE
    • CGI
  • XML Forums
    • XML
    • XSLT/XSL-FO
    • Schema
    • Web Services
  • Multimedia
    • Multimedia
    • FLASH

Find results in...

Find results that contain...


Date Created

  • Start

    End


Last Updated

  • Start

    End


Filter by number of...

Joined

  • Start

    End


Group


AIM


MSN


Website URL


ICQ


Yahoo


Jabber


Skype


Location


Interests


Languages

  1. I am working on creating a basic website for a friend's photography business and found a drop-down style of menu that she enjoyed. I found a demo on how to do and worked on putting it on my own page. http://citpt.lcsc.edu/aaronroberts/memories.html I am running into an issue that any time you hover over the menu bar at the top, the sibling division "title" that has the words "Memories by Mynique" drops down approximately 200 px. I have looked repeatedly for ways to fix this, ask various people for ideas and we can't seem to find the error. Here is my code for the page: and here is my attached CSS Any and all help would be GREATLY, GREATLY appreciated!!!
  2. Alright. So I'm attempting, quite unsuccessfully, to make the navigation bar at the top of my page to be the full width of whatever screen it is being viewed on. It's one of those simple navbars you can find tutorials on everywhere. (If I get some of the lingo wrong here, feel free to correct. I'm still learning.) ul {list-style-type:none; margin:0; padding:0; overflow:hidden;}li {float:left;}a:link,a:visited {display:block; width:120px; font-weight:bold; color:#FFFFFF; background-color:#98bf21; text-align:center; padding:12px; text-decoration:none;}a:hover,a:active {background-color:#7A991A;} <ul><li><a href="home">Home</a></li><li><a href="portfolio">Portfolio</a></li><li><a href="services">Services</a></li><li><a href="contact me">Contact Me</a></li></ul> I'd appreciate any sort of help.
  3. Hi there i dont know if i have put this in the correct place or not but hopefully you's will be able to help with this issue or at least point me in the right direction.I am new to the whole html and css however i have been building a website for my football for a while now thanks to this website and forum. The webisite so far seem to be fine in both firefox and chrome. However when checking internet explorer i have now came across an issue that i cant find a answer for.The website houses a menu system on the left hand side of the screen and when the user hover's their pointer over the required menu option another level should appear to show options for that menu header. (The html code for the menu will be added at the end of the comment along with the css style for the menu.) However with internet explorer the second level menu will not appear and i dont know why. If some could explain why this is happening or give me an idea into fixing the issue. HTML menu code <div class="box"> <img src="../Pictures/Main-Site/Menu.jpg" width="140px" style="margin-left:6px; margin-top:2px; margin-bottom:4px;"/> <br/> <div id="menuwrapper"><!-- Navigation System --> <ul><!-- LEVEL ONE --> <li><a href="index.html">Home</a></li> <li><a href="Squads.html">Squads</a> <ul><!-- LEVEL TWO --> <li><a href="SaturdaySquad.html">Saturday Squad</a></li> <li><a href="SundaySquad.html">Sunday Squad</a></li> </ul> </li> <li><a href="Fixtures.html">Team Fixtures</a> <ul><!-- LEVEL TWO --> <li><a href="SatFixtures.html">Saturday Team</a> <!--<ul> LEVEL THREE <li><a href="SatLeagueCup.html">League Cup</a></li> <li><a href="SatLeagueCup.html">GDSML Cup</a></li> <li><a href="SatFixtures.html#September">September</a></li> <li><a href="SatFixtures.html#October">October</a></li> <li><a href="SatFixtures.html#November">November</a></li> <li><a href="SatFixtures.html#December">December</a></li> <li><a href="SatFixtures.html#January">January</a></li> <li><a href="SatFixtures.html#February">February</a></li> <li><a href="SatFixtures.html#March">March</a></li> <li><a href="SatFixtures.html#April">April</a></li> </ul>--> </li> <li><a href="SunFixtures.html">Sunday Team</a> <!--<ul> LEVEL THREE <li><a href="SunFixtures.html#August">August</a></li> <li><a href="SunFixtures.html#September">September</a></li> <li><a href="SunFixtures.html#October">October</a></li> <li><a href="SunFixtures.html#November">November</a></li> <li><a href="SunFixtures.html#December">December</a></li> <li><a href="SunFixtures.html#January">January</a></li> <li><a href="SunFixtures.html#February">February</a></li> <li><a href="SunFixtures.html#March">March</a></li> <li><a href="SunFixtures.html#April">April</a></li> </ul>--> </li> </ul> </li> <li><a href="#">League Tables</a> <ul><!-- LEVEL TWO --> <li><a href="SatLeagueTable.html">Saturday League</a></li> <li><a href="SunLeagueTable.html">Sunday League</a></li> </ul> </li> <li><a href="Sponsors.html">Sponsors</a> <ul><!-- LEVEL TWO --> <li><a href="http://www.carringtondean.com" target="_blank">Carrington Dean</a></li> <li><a href="http://www.musicmagpie.com" target="_blank">Musicmagpie</a></li> <li><a href="http://www.turnbullmccarron.com" target="_blank">Turnbull and McCarron</a></li> </ul> </li> <li><a href="#">About Us</a> <ul><!-- LEVEL TWO --> <li><a href="ContactUs.html">Contact Us</a></li> <li><a href="http://www.facebook.com/profile.php?id=100003892391812" target="_blank">FACEBOOK</a></li> </ul> </li> <!--<li><a href="Members_Area/index.html">Members</a> <ul> <li><a href="Members_Area/join_form.php">New Members</a></li> <li><a href="Members_Area/login_form.php">Sign In</a></li> <li><a href="lost_pw.php">Lost Password</a></li> <li><a href="password_change.php">Change Password</a></li> </ul> </li>--> </ul> </div> <br/> <img src = "../Pictures/Main-Site/RoyalArmsScotland.png" width = "120" height = "130" style="margin-left:10%;"/> </div> CCS Style for the menu .left-sidebar{ float:left;}.box { float:left; background: navy; /*width: 160px;*/ font-family: Times New Roman; /*font-size: large;*/ color:white; margin-left:30px; margin-right:30px; border-right:solid 1px yellow; border-left:solid 1px yellow;}A:LINK { color: white; border-bottom: none;}A:VISITED { color: white; text-decoration: none; border-bottom: none;}A:HOVER { Color: none;}/* We remove the margin, padding, and list style of UL and LI components */#menuwrapper ul, #menuwrapper ul li{ margin:0; padding-left:1px; list-style:none; /*text-align:center;*/}#menuwrapper a:hover, a:active{ color:navy;}#menuwrapper li:hover > a{ color:navy;}/* We apply background color and border bottom white and width to 150px */#menuwrapper ul li{ background-color:navy; /*border-left:solid 1px yellow;*/ width:150px;}/* We apply the background hover color when user hover the mouse over of the li component */#menuwrapper ul li:hover,ul li:active{ background-color:white; color:navy; position:relative; }/* We apply the link style */#menuwrapper ul li a{ padding:5px 15px; display:block; text-decoration:none;}#menuwrapper ul li a:hover{ padding:5px 15px; display:block; text-decoration:none;}#menuwrapper ul li a:active{ color: navy; padding: 5px 15px; display: block; text-decoration: none; font-size: 14px;}/**** SECOND LEVEL MENU *** *//* We make the position to absolute for flyout menu and hidden the ul until the user hover the parent li item */#menuwrapper ul li ul{ position:absolute; display:none;}/* When user has hovered the li item, we show the ul list by applying display:block, note: 150px is the individual menu width. */#menuwrapper ul li:hover ul{ left:150px; top:0px; display:block; border:solid 1px yellow;}/* we apply different background color to 2nd level menu items */#menuwrapper ul li ul li{ background-color:blue; border-bottom:solid 1px yellow;}/* We change the background color for the level 2 submenu when hovering the menu */#menuwrapper ul li:hover ul li:hover{ background-color:white; color:navy;}/* We style the color of level 2 links */#menuwrapper ul li ul li a{ color:yellow; display:inline-block; width:150px;}/* LEVEL 3 */#menuwrapper ul li:hover ul li ul { position:absolute; display:none;}/* When user has hovered the li item, we show the ul list by applying display:block, note: 150px is the individual menu width. */#menuwrapper ul li ul li:hover ul { left:150px; top:0px; display:block; border:solid 1px yellow;}/* we apply different background color to 3rd level menu items */#menuwrapper ul li ul li ul li{ background-color:blue; border-bottom:solid 1px yellow;}/* We change the background color for the level 3 submenu when hovering the menu */#menuwrapper ul li ul li:hover ul li:hover{ background-color:white; color:navy;}/* We style the color of level 2 links */#menuwrapper ul li ul li ul li a{ color:white; display:inline-block; width:120px;} hopefully someone can get the bottom of this its been driving me nuts for days now lol
  4. I am trying to center this menu. Right now it is a local site uploaded through WAMP - but here is the css. .main-navigation {clear: both;display: block;padding: 1.5em;}.main-navigation:after {clear: both;content: "";display: block;}.main-navigation ul {list-style: none;margin: 0 auto;padding-left: 0;}.main-navigation li {float: left;margin: 0.5em 0;position: relative;}.main-navigation a {color: #7c948a;display: block;font-size: 1.4rem;font-weight: bold;margin-right: 2em;text-decoration: none;}.main-navigation ul ul {background: #e9e0d1;border: 1px solid rgba( 0, 0, 0, 0.1 );display: none;float: left;position: absolute;top: 1.2em;left: 0;z-index: 99999;}.main-navigation ul ul ul {left: 100%;top: 0;}.main-navigation ul ul a {padding: 0 1.5em;width: 200px;}.main-navigation ul ul li {}.main-navigation li:hover > a,.main-navigation li.current_page_item a,.main-navigation li.current-menu-item a,.main-navigation ul ul a:hover {color: #33605a;}.main-navigation ul ul :hover > a {}.main-navigation ul li:hover > ul {display: block;} Any ideas?
  5. Hello all. I'm relatively new to CSS, so please be gentle with me. I have a question about a vertical drop down menu I'm working on. It's looking decent so far. You can see it here, under my photo. But, as you can see in the photo, I'm hovering over "the little victorian." Obviously, I'd rather have the other categories move down while I'm hovering instead of being covered up. Make sense? I'm sure there are proper terms that I'm not using. I am also sure there is more information you need from me before anyone can answer. Just let me know what it is and I'll provide it! Thank you,Christina
  6. Hi. Can anyone tell me why this code only adds one menu item to my wordpress nav? I'm sure this could be done with an array, but I couldn't figure out how. add_filter( 'wp_list_pages', 'my_menu_link' );add_filter( 'wp_nav_menu_items', 'my_menu_link' ); function my_menu_link($items) { global $wp_query; $CustomMenuLinks;$CustomMenuLinks["Gmail"] = "www.gmail.com";$CustomMenuLinks["YouTube"] = "www.youtube.com";$CustomMenuLinks["aaaaaaaa"] = "www.sdsaaaaaaaaa.com";$class ='menu-item'; foreach( $CustomMenuLinks as $title=> $url){ $menu_link = '<li class="'.$class.'"><a href="'.$url.'">'.$title.'</a></li>'; $items = $items . $menu_link;return $items; }} //MadsRH
  7. I'm trying to create a dropdown menu effect here http://cbd-alpha.com/ideal/But I'm stuck with how to get the menu items under the "about" menu item to stack vertically like a standard dropdown. Here's the CSS: #mainNav { margin: 82px 0 0 160px;}#mainNav ul {list-style-type: none;padding-top: 8px;}#mainNav li { float: left; padding-left: 21px;}#mainNav li:first-child { padding-left: 80px; background: none;}#mainNav a { text-decoration: none; padding: 0px 10px; font: normal 14px "ITCAvantGarde", Helvetica, Arial, sans-serif; color: #FFF;}#mainNav ul ul { display: none;}#mainNav ul ul li { padding-left: 0 !important; z-index: 999 !important;}#mainNav ul ul ul { }#mainNav ul ul a { }#mainNav li:hover > a,#mainNav ul ul :hover > a { color: #afc2d1;}#mainNav ul ul a:hover { }#mainNav ul li:hover > ul { display: block;} And here's the css of a similar menu: #mainNav { margin: 0 auto; position: relative; width: 1000px; z-index: 101; } #mainNav ul { border-left: 1px solid #CCCCCC; border-right: 1px solid #FFFFFF; float: left; height: 37px; list-style: none outside none; margin: 0 auto; padding-left: 0; position: relative; z-index: 100; } #mainNav li { border-left: 1px solid #FFFFFF; border-right: 1px solid #CCCCCC; float: left; position: relative; } #mainNav a { color: #8D8C8C; display: block; font: 18px/38px "GothamBoldRegular",Helvetica,Arial,sans-serif; height: 37px; padding: 0 11px; text-decoration: none; text-transform: uppercase; } #mainNav ul ul { border: medium none; display: none; float: left; left: 0; position: absolute; top: 38px; width: 260px; z-index: 99; } #mainNav ul ul li { background: url("images/nav_bg_hover.png") repeat scroll 0 0 transparent; border: medium none !important; float: none; padding: 0 !important; } #mainNav ul ul ul { left: 100%; top: 0; } #mainNav ul ul a { background-image: none !important; border-bottom: 1px dotted #FFFFFF; color: #FFFFFF; font-weight: normal; height: auto; line-height: normal; overflow: hidden; padding: 10px !important; position: relative; text-transform: capitalize; width: 240px; z-index: 99; } #mainNav li:hover { color: #6A99C8; } #mainNav li:hover { background: url("images/nav_a_hover.jpg") repeat-x scroll center bottom transparent; } #mainNav li:hover li { color: #FFFFFF; } #mainNav ul ul li:hover a { background: url("images/nav_bg_hover.png") repeat scroll 0 0 #56A1D5 !important; } #mainNav ul li:hover > ul { display: block; } How do I stack them vertically?
  8. JoReL

    Tab Menu

    I´m looking for a tutorial and how to make a menu with 3 tabs with different content each. one of the tabs will have a video. My question is, How can i achieve this?Will it be on html only, css, or both?Thanks in advance for your time. :)I'm looking on google but nothing on how to achieve this.
  9. JoReL

    Making a Tab menu

    I´m looking for a tutorial and how to make a menu with 3 tabs with different content each. one of the tabs will have a video. My question is, How can i achieve this?Will it be on html only, css, or both?Thanks in advance for your time. :)Currently im looking on google but nothing special on how to achieve this.
  10. Hi, im having a little problem with a css menu bar displaying correctly on internet explorer but on firefox not showing it correctly. the problem is that the color I set on the css code is a red one, but firefox shows a blue color. I tried with other browsers to see if there was a problem with the code but for chrome,safari an ie the color shows correctly, having only firefox with the bad color displayed. Here is the code of the menu bar on the css: #menu {list-style:none;width:1160px;margin:30px auto 0px auto;height:43px;padding:0px 20px 0px 20px;/* Rounded Corners */ -moz-border-radius: 1px;-webkit-border-radius: 1px;border-radius: 1px;/* Background color and gradients */ background: #C81F18;background: -moz-linear-gradient(top, #0272a7, #013953);background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#0272a7), to(#013953)); I looked everywhere on the code to see if there is a misplaced color or a syntax error but haven't found it. Thanks in advanced for your time and help.
  11. Hey guys! I spent a few hours last night trying to code a drop-down menu to work on a MyBB forum skin I am working on, and even though I had put about no having the bullet-points and such, they were still coming up. I'll post the code I did later today when I have finished work (if I didn't delete it), but any suggestions as to where I might have been going wrong? I also do not want to code one that looks like those input fields, but rather the other sort that looks more pleasing and fits in better. (Will screenshot an example later for you for the desired effect I'm trying to get.)
  12. Hello there. I am implementing a JavaSript menu into my company's website, but seemed to have run into a snag. An existing script on the page is interfering with the new JavaScript menu. It is the JGlideMenu found here: http://www.sonicradish.com/labs/jGlideMenu/current/index.htmlI am using the inline example found on their page. I have the menu placed in a PHP side bar that acts as a persistent navigation that is conditionally fixed. The sidebar uses JQuery to switch from a static postion to a fixed position when reaching a certain scroll point. The JGlideMenu works great until I do any scrolling of the page. At that point the menu no longer functions. Instead the "rel" link (#tile_002), which is the next "slide" of the menu is placed at the end of the url. You can check out our website here to see what I'm talking about: mlkishigo.com/home-2012.html If I disable the conditionally fixed jquery it corrects the problem with JGlideMenu. But obviously I need them both to work. Any advice you have would be VERY MUCH appreciated. And please let me know if you need any other info to trouble shoot this. Thanks!
  13. Hi All, I'm new to web programming in general and need some advice for a site that I'm trying to pull together. The best I can do is try to describe what I'm trying to do because I really have no idea of how to implement this idea.The primary purpose of the site is to be a blog with separate directories for different themes. I was hoping to have a navigation menu on the side of the site with sort of an archive list in which a user could select the article they wish to read by selecting their way through directories as displayed in the menu. I want to be able to just bring up the article without having to redirect to a different page or reload the current one when an article is selected.I would be putting this together with Dreamweaver, but have no idea what to build this element in (JScript, VBScript, or flash item?) Thanks for any advice or guidance!
  14. So, I have finally worked out how to center my navigation menu horizontally in a cross-browser compatible way. The problem I now have though is with my dropdowns. They have inherited some of the attributes I used to center the nav and now, when the menu parent is hovered over, the dropdown pops up over it, rather than under and to the side a bit. I've tried a few fixes though am not sure the best way to go about resolving the issue in the most browser friendly way.I'm sorry, though my site is not yet live. #nav {-khtml-border-radius: 0px;-moz-border-radius: 0px;-webkit-border-radius: 0px;background-image:url(/wp-content/themes/child/images/banner.png);border-radius: 0px;clear: both;color: #555;margin: 0 auto 0px;overflow: hidden;text-align: center;text-transform: uppercase;height: 35px;width: 920px;}#nav ul {width: 100%;margin: 0 auto;display: inline-block;list-style: none;}#nav li {display: inline-block;list-style: none;}#nav li a {color: #90877C;display: block;font-size: 12px;float: left;margin: 0px 0px 0px 0px;padding: 8px 15px 0px 15px;text-decoration: none;}#nav li a:hover,#nav li a:active,#nav li:hover a,#nav .current_page_item a,#nav .current-cat a,#nav .current-menu-item a {color: #90877C;}#nav li a:hover {color: #222;}#nav li li a,#nav li li a:link,#nav li li a:visited {background: #fbf7eb;border-top-width: 0px;color: #555;font-size: 11px;position: relative;margin: 0px px 0px 5px;text-transform: none;text-align: left;width: 100px;}#nav li li a:hover,#nav li li a:active {color: #222;}#nav li ul {height: auto;left: -9999px;margin: 0 0 0 -1px;position: absolute;width: 150px;z-index: 9999;}#nav li ul a {width: 130px;}#nav li ul ul {margin: -33px 0 0 122px;}#nav li:hover>ul,#nav li.sfHover ul {left: auto;} I should probably mention I'm just learning CSS so any clear suggestions would be great. Thanks so much.
  15. Hi all, I am currently brushing up on some skills, and I've run into an issue. I'm working with a double line van menu, and I want to include drop downs throughout the menue. The drop downs are ok for the bottom line, but the top line is having some issues. I've attached the file I'm working with. Bonus to anyone who can help me get the css styling the first level of the nav to stop affecting the second level. Thanks,Rebecca index2.html
  16. jemz

    Menu(php)

    Hi, can i ask is it possible to use php array in my simple menu?Can you give me some pointers what should i do so that i can have idea. Home || pictures || about me
  17. I'm a complete newbie... I knew HTML1 years back, just trying to learn HTML5/CSS and well, making progress but slowly. Trying to do a small portfolio site for myself (art/photos/design) and have a pretty good chunk of the site done now, except having a 'few' issues with a vertical menu. Tried searching for it online for an hour, and everything is way too fancy for what I am after, or the subs are flyouts. I finally found something close, but jquery. Just wondered if anyone could point me to a cut/paste, download, or tutorial on how to do a menu like the one in the below link, however, right justified. I know, most are probably going to ask 'why right justified'... simply put, it matches the design/layout of my site. Wasn't sure to post this here or jquery, the below is jquery but really just want a working menu at this time that expands and stays open. What I have now is all double spaced, just have a list... which is fine for main menu items but I want the sub menus to be single spaced and no bullets/numbers. Basically, when on the Portfolio section of the site, I want the menu to appear, stay on the left throughout the pages, and when I click DESIGN, it expands, lists projects, I can click the project which takes me to that page but the menu stays open until I leave that section type deal. Can anyone point me into the right direction? Way behind on this project and running out of hair to pull. Link:http://www.stunichol...nutree.html#url ThanksHere is a layout of the site saved as a JPG for reference, menu on the left
  18. So I have a standard two level menu in one php file that I show on all the pages on a website. The menus and submenus are nested <ul> elements. When you go to a page, I would like the submenu that includes that page to be open by default. And also to stay open if another submenu isn't hovered over. I think I can figure out the menu transformations. The part I need help on is finding the submenu that the active page is contained in so I can set that one to be open.
  19. hey eryone I want do edit a menu select , ex: a menu selct Date , how to display data from db in the menu select it , Can help me Thask befpre
  20. Hello! I'm working on building a small website for my company. I need help in figuring out why the menu isn't working out... Here is what I've built so far: http://silverbergandsons.com/beta/ I can't figure out why the list items are shifted over to the right like there's an invisible bullet there... this applies to the submenu too. When I use width:100% for the background of the menu, it stretches out the page to the right side... Probably has sometime to do with the invisible bullets in problem #1. I can't get the images/menu buttons centered in the page... And lastly, I've been building this in Chrome... It reeeeeally doesn't look right in IE. lol Here is the HTML (please excuse the messy coding, I will tidy it up and make sure it's W3C validated in the end. Just need help with the JS menu): <html><head><title>S. Silverberg & Sons Jewelers - Tucson, Arizona - Custom design your own unique and original engagement ring, wedding band, bridal set, or other fine jewelry.</title><meta name="description" content="S. Silverberg & Sons Jewelers - Custom design your own unique and original engagement ring, wedding band, bridal set, or other fine jewelry." /><meta name="keywords" content="silverberg, sons, tucson, arizona, jewelers, jeweler, jewelry, store, stores, engagement, wedding, bridal, anniversary, ring, rings, band, bands, set, sets, custom, design, designed, designing, diamond, diamonds, gift, gifts, gem, gems, gemstone, gemstones, precious stones, birthstones, bracelet, bracelets, pendant, pendants, necklace, necklaces, earring, earrings, gold, platinum, estate, estates, buy, sell, repair, repairs, appraisal, appraisals, appraiser, insurance, watch, watches, seiko, men, ladies " /><link rel="stylesheet" type="text/css" href="style.css" /><script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js"></script><script type="text/javascript" src="java.js"></script></head><body><div class="header" style="text-align:center"><img src="images/header_logo.png" alt="Welcome to S. Silverberg & Sons Jewelers"></div><ul id="menu"><li><a href="#"><img src="images/nav_jewelry.png" border="0" alt="Jewelry" onmouseover="this.src='images/nav_jewelry_select.png'" onmouseout="this.src='images/nav_jewelry.png'" /></a></li><li><a href="#"><img src="images/nav_diamonds.png" border="0" alt="Diamonds" onmouseover="this.src='images/nav_diamonds_select.png'" onmouseout="this.src='images/nav_diamonds.png'" /></a></li><li><a href="#"><img src="images/nav_design.png" border="0" alt="Custom Designing" onmouseover="this.src='images/nav_design_select.png'" onmouseout="this.src='images/nav_design.png'" /></a> <ul class="noJS"> <li><a href="#">Hellenico</a></li> <li><a href="#">Genere</a></li> <li><a href="#">Indulgentia</a></li> </ul></li><li><a href="#"><img src="images/nav_services.png" border="0" alt="Services" onmouseover="this.src='images/nav_services_select.png'" onmouseout="this.src='images/nav_services.png'" /></a></li><li><a href="#"><img src="images/nav_goldbuy.png" border="0" alt="Gold Buying" onmouseover="this.src='images/nav_goldbuy_select.png'" onmouseout="this.src='images/nav_goldbuy.png'" /></a></li><li><a href="#"><img src="images/nav_learn.png" border="0" alt="Learn More" onmouseover="this.src='images/nav_learn_select.png'" onmouseout="this.src='images/nav_learn.png'" /></a></li><li><a href="#"><img src="images/nav_about.png" border="0" alt="About Us" onmouseover="this.src='images/nav_about_select.png'" onmouseout="this.src='images/nav_about.png'" /></a></li><li><a href="#"><img src="images/nav_contact.png" border="0" alt="Contact Us" onmouseover="this.src='images/nav_contact_select.png'" onmouseout="this.src='images/nav_contact.png'" /></a></li></ul></body></html> Here is the CSS: body{padding: 0;margin: 0;background-color:#111111;} .header{background-image:url('images/header_bg.png');background-repeat:repeat-x;} #menu {float: left;background-image:url('images/nav_bg.png');background-repeat:repeat-x;font-family: Georgia;font-size: 12px;margin: auto;}#menu > li {float: left;}#menu li a {display: block;text-decoration: none;text-align:center;}#menu ul {position:absolute;display: none;list-style: none;float: left;}#menu ul li a {width: 80px;padding: 0 1.5em;height: 2em;line-height: 2em;color: #ffffff;text-align: left;background: #000000;}#menu li:hover ul.noJS {display: block;}#menu ul li:hover a {color: #f0bd66;background: #121212;} And here is the javascript: $(function(){ $('#menu').find('> li').hover(function(){ $(this).find('ul') .removeClass('noJS') .stop(true, true).slideToggle('fast'); });}); Any help would be GREATLY appreciated. Thank you in advance! EDIT: If this is more of a CSS question, please feel free to move my topic. Thank you!
×
×
  • Create New...