Results 1 to 4 of 4

Thread: Adding image-bullets to Glossy Accordion Menu

  1. #1
    Join Date
    Feb 2011
    Posts
    4
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Question Adding image-bullets to Glossy Accordion Menu

    1) Script Title: Glossy Accordion Menu

    2) Script URL (on DD): http://www.dynamicdrive.com/dynamici...enu-glossy.htm

    3) Describe problem:

    I have modified the HTML code of the Glossy Accordion Menu, so as to put a "blue ball" image-bullet in front of each sub-menu item. So far so good!

    http://www.nonstopsystems.com/menu-t...rdion-test.htm

    I have tried everything that I could think of, to add a "red ball" image-bullet to the menu-header items (those with the blue background) - but no "beginner's luck"!

    Who can help? Thanks in advance!

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

    Default

    Nononono! Use list-style-image, http://www.w3schools.com/css/pr_list-style-image.asp

    As for adding an image to the headers, can you just add an image tag in the link?
    Code:
    <a class="menuitem" href="http://www.dynamicdrive.com/"><img src="red.gif" />Dynamic Drive</a>
    Jeremy | jfein.net

  3. #3
    Join Date
    Feb 2011
    Posts
    4
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    Thanks Nile,

    that does the trick!

    I did try the suggestion for the list-style-image approach, but that puts the bullet to the left (i.e., outside) of the accordion.

    Now all I have to do, is convert my homepage into a frameless format (after 12 years, it needs some cleaning up ).

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

    Default

    No problem, I'm glad to help

    Here on DD, we like to keep things organized. In an effort to do so, you have the option to set a thread to resolved when an issue is fixed. To make the status of the thread resolved:
    1. Go to your first post
    2. Edit your first post
    3. Click "Go Advanced"
    4. In the dropdown next to the title, select "RESOLVED"
    Jeremy | jfein.net

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
  •