Results 1 to 2 of 2

Thread: How to put single linked items in the Bullit list accordion menu????

  1. #1
    Join Date
    Oct 2011
    Posts
    2
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default How to put single linked items in the Bullit list accordion menu????

    1) Script Title:

    Bullit list accordion menu

    2) Script URL (on DD):

    http://www.dynamicdrive.com/dynamici...ordionmenu.htm

    3) Describe problem:

    Hi,

    I am trying to transform the 'Bullit list accordion menu' to fit my site and colors. CCS wise it is working alright, but I am struggling with two things:

    ?- Below I have given an example of the intended menu-tree. What do I need to do to have main items 1-5 and 7-9 show up like the menuheaders, but being links and not being folding open items? So, they would look like a button that would fold open when clicked, but instead nothing is unfolding, they are direct links to a next page.

    ?- In this tree, I would like to have item 6 as the only opened item on the index.html page when people land on my homepage. I don't understand what settings I need to make, to choose which item will be the opened one on the index.html page. I think I do understand though how to work this when linking to a next page, since you have described this on demo page. Just not for the initial homepage / index.html page opening.


    Thanks for the feedback. Keep in mind, I am just starting with this kind of stuff, so not too familiar with java programming and such. Please give full and clear explanations if possible, just like the script has been done, really nice and tight written it is! Thanks again.

    Hans 't Hart
    Netherlands

    Example tree:

    1-Verzekeren? Doen!
    2-Spoedgeval
    3-Inschrijven
    4-Bestellen
    5-Nieuws!
    6-Over ons
    Even voorstellen
    Algemene informatie
    Tarieven
    Routebeschrijving
    Contact
    Stage lopen bij ons
    [/INDENT]
    7- Orthopedie – Botchirurgie
    8- Kennelbegeleiding
    9- Eregalerij
    10-Bibliotheek
    Medisch
    -Hondenleven
    -Overig
    Voeding (was voedingsadviezen)
    Kliniekverhalen
    Dieren en zo
    - Puppyzaken
    - Konijn
    - Cavia
    - Hamster
    - Chinchilla
    11-Overig
    Dierenambulance
    Verloren & Gevonden
    Links
    Last edited by hansthart; 10-10-2011 at 08:15 PM.

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

    Default

    Headers that do not contain sub menus should simply not carry the designated CSS class name shared by those that do. If you look at the menu in this demo, for example, you'll notice that menu headers 1, 2, 3, and 5 are just ordinary headers with no sub contents. Looking at the menu's source, you'll see how they don't carry the CSS class in red:
    Code:
    <div class="glossymenu">
    <a class="menuitem" href="http://www.dynamicdrive.com/">Dynamic Drive</a>
    <a class="menuitem submenuheader" href="http://www.dynamicdrive.com/style/" >CSS Examples</a>
    <div class="submenu">
    	<ul>
    	<li><a href="http://www.dynamicdrive.com/style/csslibrary/category/C1/">Horizontal CSS Menus</a></li>
    	<li><a href="http://www.dynamicdrive.com/style/csslibrary/category/C2/">Vertical CSS Menus</a></li>
    	<li><a href="http://www.dynamicdrive.com/style/csslibrary/category/C4/">Image CSS</a></li>
    	<li><a href="http://www.dynamicdrive.com/style/csslibrary/category/C6/">Form CSS</a></li>
    	<li><a href="http://www.dynamicdrive.com/style/csslibrary/category/C5/">DIVs and containers</a></li>
    	<li><a href="http://www.dynamicdrive.com/style/csslibrary/category/C7/">Links & Buttons</a></li>
    	<li><a href="http://www.dynamicdrive.com/style/csslibrary/category/C8/">Other</a></li>
    	<li><a href="http://www.dynamicdrive.com/style/csslibrary/all/">Browse All</a></li>
    	</ul>
    </div>
    <a class="menuitem" href="http://www.javascriptkit.com/jsref/">JavaScript Reference</a>
    <a class="menuitem" href="http://www.javascriptkit.com/domref/">DOM Reference</a>
    <a class="menuitem submenuheader" href="http://www.cssdrive.com">CSS Drive</a>
    <div class="submenu">
    	<ul>
    	<li><a href="http://www.cssdrive.com">CSS Gallery</a></li>
    	<li><a href="http://www.cssdrive.com/index.php/menudesigns/">Menu Gallery</a></li>
    	<li><a href="http://www.cssdrive.com/index.php/news/">Web Design News</a></li>
    	<li><a href="http://www.cssdrive.com/index.php/examples/">CSS Examples</a></li>
    	<li><a href="http://www.cssdrive.com/index.php/main/csscompressor/">CSS Compressor</a></li>
    	<li><a href="http://www.dynamicdrive.com/forums/forumdisplay.php?f=6">CSS Forums</a></li>
    	</ul>
    	<img src="http://i27.tinypic.com/sy7295.gif" style="margin: 10px 5px" />
    </div>
    <a class="menuitem" href="http://www.codingforums.com/" style="border-bottom-width: 0">Coding Forums</a>		
    </div>
    The CSS class "submenuheader" is the shared class of menu headers with sub content, as defined by you inside the initialization code of the menu:
    Code:
    ddaccordion.init({
    	headerclass: "submenuheader", //Shared CSS class name of headers group
    	contentclass: "submenu", //Shared CSS class name of contents group
    "
    DD Admin

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
  •