SitePoint Sponsor |
|
User Tag List
Results 1 to 8 of 8
-
Jan 16, 2008, 14:14 #1
- Join Date
- Sep 2004
- Location
- Phoenix, Az
- Posts
- 551
- Mentioned
- 0 Post(s)
- Tagged
- 0 Thread(s)
CSS Dropdown menu doesn't work in IE6
As far as I can tell this should work in IE6, but the drop down menus seen under MY PROFILE, CONTESTS, and CASTING do not show for users in IE6. Can anyone help me out?
Code:<div id="nav"> <ul id="nav_ul"> <li><a href="/tv">WATCH TELEVISION</a></li> <li><a class="drowdown" href="/user">MY PROFILE</a> <ul> <li><a href="/user">HOME</a></li> <li><a href="/profile/professional">EDIT</a></li> <li><a href="/profile/myprofile">VIEW</a></li> <li><a href="/messages">MESSAGES</a></li> <li><a href="/profile/edit/section/photos">PHOTOS</a></li> <li><a href="/blogs/view/user/jhorra">BLOG</a></li> <li><a href="/user/hotlist">HOT lIST</a></li> </ul> </li> <li><a href="/">COMMUNITY</a></li> <li><a href="/user/search">BROWSE</a></li> <li><a class="drowdown" href="#">CONTESTS</a> <ul> <li><a href="/contests/showcontest/contest/1">THE CASTING CALL</a></li> <li><a href="/contests/showcontest/contest/2">AFFILIATE CONTEST</a></li> </ul> </li> <li><a class="drowdown" href="#">CASTING & MEDIA</a> <ul> <li><a href="#">COMING SOON</a></li> </ul> </li> <li><a href="/corporate/contact">CORPORATE</a></li> <li><a href="/login/register">JOIN</a></li> <li><a href="/login/logout">LOGOUT</a></li> </ul> <br class="clearit"> </div>
Code:#nav { height:20px; line-height:20px; background:#1e1e1e url(/public/images/site_section_heading_bg.jpg) repeat-x; font-weight:bold; } .clearit { clear: both; height: 0; line-height: 0.0; font-size: 0; } #nav_ul, #nav_ul ul { padding: 0; margin: 0; list-style: none; font-family: Arial, Helvetica, sans-serif; } #nav_ul a { display: block; text-decoration: none; padding: 0px; color: #FFE400; } #nav_ul a.drowdown { padding: 0px; } #nav_ul li { float: left; padding:0px 15px; } #nav_ul ul li a { padding:0px; } #nav_ul li ul { position: absolute; display: none; background:#1e1e1e; height:20px; line-height:20px; } #nav_ul li:hover a, #nav_ul a:focus, #nav_ul a:active, #nav_ul li.li_hover a { color: #FFFFFF; } #nav_ul li:hover ul, #nav_ul li.li_hover ul { display: block; } #nav_ul li:hover ul a, #nav_ul li.li_hover ul a { color: #FFE400; background-color: transparent; } #nav_ul ul a:hover { background-color: transparent!important; color: #FFFFFF!important; } #nav_ul li { width: auto; }
-
Jan 16, 2008, 14:19 #2
- Join Date
- Jul 2006
- Posts
- 493
- Mentioned
- 0 Post(s)
- Tagged
- 0 Thread(s)
IE 6 will not apply li:hover unless you use a htc file or javascript.
-
Jan 16, 2008, 14:36 #3
- Join Date
- Sep 2004
- Location
- Phoenix, Az
- Posts
- 551
- Mentioned
- 0 Post(s)
- Tagged
- 0 Thread(s)
I guess the hover should really be on the a instead, if I add this do you think it would work?
#nav_ul li a:hover ul, #nav_ul li a:hover ul li
{
display:block
}
-
Jan 17, 2008, 06:05 #4
- Join Date
- Jul 2003
- Location
- Kent
- Posts
- 1,921
- Mentioned
- 1 Post(s)
- Tagged
- 0 Thread(s)
son of suckerfish is the usual answer
Dr John
www.kidneydialysis.org.uk
-
Jan 17, 2008, 06:36 #5
- Join Date
- May 2007
- Location
- Newcastle, Australia
- Posts
- 3,718
- Mentioned
- 0 Post(s)
- Tagged
- 0 Thread(s)
You are using an .li_hover class - are you also using the suckerfish javascript to apply this class as behaviours ?
-
Jan 17, 2008, 10:25 #6
- Join Date
- Sep 2004
- Location
- Phoenix, Az
- Posts
- 551
- Mentioned
- 0 Post(s)
- Tagged
- 0 Thread(s)
This is the javascript I'm using
Code:function P7_ExpMenu() { //v1.1.0.2 by PVII-www.projectseven.com if(navigator.appVersion.indexOf("MSIE")==-1) {return;} var i,k,g,lg,r=/\s*li_hover/,nn='',c,cs='li_hover',bv='nav_ul'; for(i=0;i<10;i++) { g=document.getElementById(bv+nn); if(g) { lg=g.getElementsByTagName("li"); if(lg) { for(k=0;k<lg.length;k++) { lg[k].onmouseover=function() { c=this.className; cl=(c)?c+' '+cs:cs; this.className=cl; }; lg[k].onmouseout=function() { c=this.className; this.className=(c)?c.replace(r,''):''; }; } } } nn=i+1; } }
-
Jan 17, 2008, 10:44 #7
- Join Date
- May 2006
- Location
- Aurora, Illinois
- Posts
- 15,476
- Mentioned
- 0 Post(s)
- Tagged
- 0 Thread(s)
Try using this instead.
http://www.xs4all.nl/~peterned/csshover.html
(PS: You don't need the DIV or the clearer class in your code either.)Save the Internet - Use Opera | May my mother rest in peace: 1943-2009
Dan Schulz - Design Team Advisor | Follow me on Twitter
SitePoint References: HTML CSS JavaScript | Become A Guru
WordPress SEO Checklist | What WordPress Plugins Do You Use?
Web Standards Curriculum | Image Free Equal Height Columns
-
Jan 17, 2008, 11:46 #8
- Join Date
- Sep 2004
- Location
- Phoenix, Az
- Posts
- 551
- Mentioned
- 0 Post(s)
- Tagged
- 0 Thread(s)
Figured it out, I never actually told the js function to run
Bookmarks