Results 1 to 6 of 6

Thread: CSS Drop Down Menu failure

  1. #1
    Join Date
    Apr 2009
    Posts
    7
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default CSS Drop Down Menu failure

    1) Script Title:

    Chrome CSS Drop Down Menu

    2) Script URL (on DD):

    http://www.dynamicdrive.com/dynamici...rome/index.htm

    3) Describe problem:

    This was used on a mac and checked out using the latest version version of Firefox.

    The script produced a vertical bullet list. None of the drop down menus worked - it is like the script was not present. The drop down menus show up as two lists at the end of the bullet list.
    Here is how it displays.

    Home
    Mission
    Services
    Consulting
    About Us
    Downloads
    Contact
    Services Wireless Site Survey Security
    Team Advisory Board Privacy Policy

    Clearly it is not installed properly. There are no difference in the code when compared to the web site list (except my link changes) and the components were downloaded and then uplinked to my web page.

    is there a dropmenudiv.css missing from the folder and thus not installed?

    It looks like it is not seeing or performing the chromemenu script

    Any suggestions?

    Regards,

    Bruce

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

    Default

    On the same computer setup, does the menu on the DD demo page work for you? If so, please post a link to the page on your site that contains the problematic script so we can check it out.work for you.
    DD Admin

  3. #3
    Join Date
    Apr 2009
    Posts
    7
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    The web site using the drop down menu is

    www.aitest.info/home.html

  4. #4
    Join Date
    Apr 2009
    Posts
    7
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    The dynamicdrive.com demo works great as does the standalone demo.html. I have not tried to embed the demo as a page in my site to test it further.

    I copied and pasted your code directly into my page and then added the .js and css files to files.

    The drop down menus are seductively cool.

    Regards,

    Bruce

  5. #5
    Join Date
    Mar 2005
    Location
    SE PA USA
    Posts
    30,495
    Thanks
    82
    Thanked 3,449 Times in 3,410 Posts
    Blog Entries
    12

    Default

    You really haven't followed the installation process properly.

    • The Chrome CSS Drop Down Menu styles (chromestyle.css) are not linked to the page. Without these, the markup will appear as an ordinary list.
    • There should be only one external script tag (not counting your other scripts which appear not to conflict, thankfully) in the head with:

      Code:
      <script type="text/javascript" src="Home_files/chrome.js">
      
      /***********************************************
      * Chrome CSS Drop Down Menu- (c) Dynamic Drive DHTML code library (www.dynamicdrive.com)
      * This notice MUST stay intact for legal use
      * Visit Dynamic Drive at http://www.dynamicdrive.com/ for full source code
      ***********************************************/
      
      </script>
    • The call to 'startchrome' must be an ordinary script tag with no src attribute, and should appear only once, after all the Chrome CSS Drop Down Menu content:

      Code:
      <div class="chromestyle" id="chromemenu">
      <ul>
      <li><a href="http://www.airinformatics.com">Home</a></li>
      <li><a href="http://www.airinformatics.com/Mission.html">Mission</a></li>
      <li><a href="#" rel="services1">Services</a></li>
      <li><a href="http://www.airinformatics.com/Consulting.html">Consulting</a></li>
      <li><a href="#" rel="about">About Us</a></li>
      <li><a href="http://www.airinformatics.com/Downloads.html">Downloads</a></li>
      
      <li><a href="http://www.airinformatics.com/Contact.html">Contact</a></li>
      </ul>
      </div>
      
      <!--1st drop down menu --> 
      <div id="services1" class="dropmenudiv" style="width: 150px;">
      <a href="http://www.airinformatics.com/Services.html">Services</a>
      <a href="http://www.airinformatics.com/Wireless_Site_Survey.html">Wireless Site Survey</a>
      <a href="http://www.airinformatics.com/Home.html">Security</a>
      </div>
      
      
      <!--2nd drop down menu --> 
      
      <div id="about" class="dropmenudiv" style="width: 150px;">
      <a href="http://www.airinformatics.com/Team.html">Team</a>
      <a href="http://www.airinformatics.com/Advisory_Board.html">Advisory Board</a>
      <a href="http://www.airinformatics.com/Home.html">Privacy Policy</a>
      </div>
      
      <script type="text/javascript">
      cssdropdown.startchrome("chromemenu")
      </script>


    Doing those things will at least get it working. However, in a local mock up of your page with these changes there is a problem - the positioning of the drop downs is off. This can be fixed by moving these parts, and only these parts:

    Code:
    <!--1st drop down menu --> 
    <div id="services1" class="dropmenudiv" style="width: 150px;">
    <a href="http://www.airinformatics.com/Services.html">Services</a>
    <a href="http://www.airinformatics.com/Wireless_Site_Survey.html">Wireless Site Survey</a>
    <a href="http://www.airinformatics.com/Home.html">Security</a>
    </div>
    
    
    <!--2nd drop down menu --> 
    
    <div id="about" class="dropmenudiv" style="width: 150px;">
    <a href="http://www.airinformatics.com/Team.html">Team</a>
    <a href="http://www.airinformatics.com/Advisory_Board.html">Advisory Board</a>
    <a href="http://www.airinformatics.com/Home.html">Privacy Policy</a>
    </div>
    
    <script type="text/javascript">
    cssdropdown.startchrome("chromemenu")
    </script>
    to the last thing before the closing </body> tag.
    - John
    ________________________

    Show Additional Thanks: International Rescue Committee - Donate or: The Ocean Conservancy - Donate or: PayPal - Donate

  6. #6
    Join Date
    Apr 2009
    Posts
    7
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default Thanks!

    Thanks - that seemed to do it. It works great!

    I have a little tweaking to do so I am not done yet.

    Regards,

    Bruce

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
  •