Results 1 to 5 of 5

Thread: Problem With Chrome CSS Drop Down Menu

  1. #1
    Join Date
    Aug 2008
    Posts
    3
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Exclamation Problem With Chrome CSS Drop Down Menu

    1) Script Title: Chrome CSS Drop Down Menu (v2.4)

    2) Script URL (on DD): http://www.dynamicdrive.com/dynamici...rome/index.htm

    3) Describe problem:

    On the site http://www.shawshara.com, if the window width is large (try 1600px or more) the drop down menu does not appear right under its parent menu. Please note that the user doesn't see any problem is the 1280px or smaller. The wider the window the more apparent the problem is.

    Can you suggest any fixes for this problem? Thanks in advance.

  2. #2
    Join Date
    Jan 2008
    Posts
    4,168
    Thanks
    28
    Thanked 628 Times in 624 Posts
    Blog Entries
    1

    Default

    What browser are you speaking of?
    I tried it in FF3, and IE 7. It works in both.
    Also, if you mean it displaying on top of the menu, instead of button, thats by default.
    I hope this helps, Nile
    Jeremy | jfein.net

  3. #3
    Join Date
    Aug 2008
    Posts
    3
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    Thanks for responding to my post.

    The problem occurs with both IE7 and FF3. The problem occurs only if your browser is wider than 1600px. The wider the browser window the more apparent the problem. Once you hover over the main navigation nodes, the drop down menu doesn't appear right under the main navigation nodes but more to the right.

  4. #4
    Join Date
    Aug 2004
    Posts
    10,143
    Thanks
    3
    Thanked 1,008 Times in 993 Posts
    Blog Entries
    16

    Default

    Most of the positioning problems with the drop down menus can be solved by making sure the HTML for the drop down DIVs themselves is outside any container tag on the page other than the BODY. So in your case, try moving all the drop down DIVs to the bottom of your page, just above the "</body>" tag:
    Code:
    <div id="navigation_.2F_.D8.AA.D8.B5.D9.81.D8.AD" class="dropmenudiv">
    <a href="/wiki/Main_Page">Home / الصفحة الرئسية</a><a href="/wiki/Special:Recentchanges">Recent changes / أحدث التغييرات</a><a href="/wiki/Shawshara:Tutorial">Tutorial / كيفية تعديل الصفحات</a><a href="/wiki/Shawshara:Requests">Request a song / أطلب أغنية</a></div>
    
    <div id="Artists_List_.2F_.D9.82.D8.A7.D8.A6.D9.85.D8.A9_.D8.A7.D9.84.D9.85.D8.BA.D9.86.D9.8A.D9.86" class="dropmenudiv">
    <a href="/wiki/Category:%D9%85%D8%BA%D9%86%D9%8A%D9%86">بالأحرف العربية</a><a href="/wiki/Category:Singers">English alphabet</a></div>
    
    <div id="Songs_List_.2F_.D9.82.D8.A7.D8.A6.D9.85.D8.A9_.D8.A7.D9.84.D8.A3.D8.BA.D8.A7.D9.86.D9.8A" class="dropmenudiv">
    <a href="/wiki/Category:%D8%A3%D8%BA%D8%A7%D9%86%D9%8A">بالأحرف العربية</a><a href="/wiki/Category:Songs">English alphabet</a></div>
    
    <div id="Community_.2F_.D8.B4.D8.A7.D8.B1.D9.83.D9.88.D9.86.D8.A7" class="dropmenudiv">
    <a href="http://blog.shawshara.com">Blog / مدوّنة</a><a href="http://www.facebook.com/pages/Shawsharacom/19204712964">Facebook Page / صفحتنا على فيس *بوك</a><a href="http://www.facebook.com/apps/application.php?id=27553764032">Facebook App / تطيق فيس *بوك</a></div>
    
    <div id="toolbox" class="dropmenudiv">
    <a href="/wiki/Special:Whatlinkshere/Main_Page" title="List of all wiki pages that link here [j]" accesskey="j">What links here</a><a href="/wiki/Special:Recentchangeslinked/Main_Page" title="Recent changes in pages linked from this page [k]" accesskey="k">Related changes</a><a href="/wiki/Special:Upload" title="Upload files [u]" accesskey="u">Upload file</a><a href="/wiki/Special:Specialpages" title="List of all special pages [q]" accesskey="q">Special pages</a><a href="/w/index.php?title=Main_Page&amp;oldid=3004" title="Permanent link to this version of the page">Permanent link</a></div>	
    	<script type="text/javascript">
            cssdropdown.startchrome("chromemenu")
        </script>
    
    </body>
    BTW, please note that your page is currently in violation of our usage terms, since the credit notice doesn't appear inline on the page. Please reinstate the credit notice: http://www.dynamicdrive.com/notice.htm
    DD Admin

  5. #5
    Join Date
    Aug 2008
    Posts
    3
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    Thanks for your help. Your suggestion fixed the problem, and I also added the copyright notice. Thanks again for your support.

Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •