I'm having the same issue of the drop down pushing the content below it
further down: http://tinyurl.com/6qczuv. It would be great if someone could
point me to where the issue might be.
Joel Birch wrote:
>
>
> Hi Bob,
>
> You seem to be missing some very important CSS. The submenu ul
> elements must be position absolute. Also, I don't see any 'top' or
> 'left' values or hover rules for them. Please refer to the original
> demo CSS files for further clues.
>
> Joel Birch
>
> On 23/10/2008, Bob Sawyer <[EMAIL PROTECTED]> wrote:
>>
>> So, the problem I'm having with IE6/Superfish is that the dropdown
>> menus push all other content down, rather than displaying on top of
>> the other content.
>>
>> My superFish code is fairly straightforward:
>>
>> $(document).ready(function() {
>> //superFish
>> $('ul#menu').superfish({
>> animation : { opacity:"show",height:"show"},
>> pathClass: "current",
>> speed: "fast"
>> });
>> $('ul#menu').superfish().find('ul').bgIframe({opacity:false});
>> });
>>
>> Removing either line makes no difference -- the result is the same,
>> and obviously having both in there is probably overkill.
>>
>> My menu is pretty lightweight:
>>
>> <div id="nav" class="grid_12">
>> <ul id="menu">
>> <li class="current"> /home Home </li>
>> <li> /collections Collections
>> <ul>
>> <li> /collections/collection/fall2008
>> 2008">Fall 2008 </li>
>> <li> /collections/collection/spring2009
>> 2009">Spring 2009 </li>
>> </ul>
>> </li>
>> <li> /about About Us
>> <ul>
>> <li> /news News </li>
>> <li> /press Press </li>
>> </ul>
>> </li>
>> <li> /contact Contact Us </li>
>> </ul>
>> </div>
>>
>> I stripped the existing superfish.css down to only the Essential
>> Styles and "apply hovers to modern browsers" sections; otherwise the
>> CSS is pretty straightforward as well:
>>
>> #nav {
>> width: 960px;
>> height: 40px;
>> background: transparent url(/images/nav_bg.gif) 0px 0px no-repeat;
>> display: block;
>> position: relative;
>> margin: 15px 0 0 0;
>> z-index: 100;
>> }
>>
>> #menu li {position: relative; display:block; float: left; height:
>> 40px; margin: 0; padding: 0; font-size: 16px; line-height: 40px; }
>> #menu li a {position: relative; display: block; float: left; color:
>> #64a3b5;text-decoration: none; height: 40px; padding: 0 20px; }
>> #menu li a:link { color: #64a3b5; }
>> #menu li a:hover { color: #000; background: #dfdfdf; }
>> #menu li.current a { color: #333; }
>>
>> #menu ul {display: block; background-color: #f0e9f1; border-bottom:
>> 1px solid #ccc; margin: 0; padding: 0; clear: both; width: 130px;}
>>
>> #menu ul li {position: relative; display: block; float: none; height:
>> 30px; margin: 0; padding: 0; line-height: 30px; font-size: 90%;}
>> #menu ul li a {position: relative; display: block; float: none; color:
>> #64a3b5; text-decoration: none; height: 30px; margin: 0; padding: 0 0
>> 0 15px; z-index: 120;}
>> #menu ul li a:hover { color: #000; background: #dfdfdf; }
>> #menu ul li.current a { color: #333; }
>>
>> Any ideas?
>>
>> Thanks,
>> Bob
>>
>
>
--
View this message in context:
http://www.nabble.com/superfish-%2B-bgiframe-problem-on-IE6-tp19795827s27240p20717771.html
Sent from the jQuery General Discussion mailing list archive at Nabble.com.
