As a web developer, you should know that how buggy list-style-image:url() is and all you can do is to use background-image:url() to avoid any problems you may not want to deal with.
Since list-style-image:url() is almost 99% useless to me, so I was thinking maybe I can make use of the rest 1% to see if I can do some funky stuff here.
One thing cool I knew about list-style-image:url() is that its value can be inherited from an element's parent element. So assume we have the following HTML:
The SPAN element (id="bar") will also has its own list-style-image:url(foo.gif); which inherits from its grand parent element even though this SPAN element does not have a CSS value of display:list-item; which had been set yet.
So this seems useful to me, because I can check any a element's list-style-image to see if it inherits some behaviors or atributes form its parent or grand elements and I do want to combine this technic with Event Delegation to see if I can cook some DHTML behaviors quickly.
The following is a very simple example which explains how to combine both CSS inheritence with Event Bubbling module together to generate a DHTML behavior. You may view the source JavaScript if you wanna know more details.
paragraph paragraph paragraph paragraph