PDA

View Full Version : Adding image-bullets to Glossy Accordion Menu



Stepper
02-04-2011, 09:41 PM
1) Script Title: Glossy Accordion Menu

2) Script URL (on DD): http://www.dynamicdrive.com/dynamicindex17/ddaccordionmenu-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-test/accordion-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"! :mad:

Who can help? Thanks in advance!

Nile
02-04-2011, 10:41 PM
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?


<a class="menuitem" href="http://www.dynamicdrive.com/"><img src="red.gif" />Dynamic Drive</a>

Stepper
02-06-2011, 03:21 PM
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 :) ).

Nile
02-06-2011, 03:32 PM
No problem, I'm glad to help :D

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"