html - Dynamic/Infinate UL / LI Hover expand....? -
i have created php script makes lovely list....
using database creates lots of items , sub items. database, can infinitively deep list , sub lists.
how can used css (or put code in ul/li directly) allow infinite sub items displayed , when parents hovered over?
example:
<ul> <li>welcome! - levelno:0 id:1 parent:0 order:0</a> <ul> <li>test - levelno:0 id:13 parent:1 order:-3</a></li> <li>cars - levelno:1 id:2 parent:1 order:0</a> <ul> <li>bugatti - levelno:2 id:5 parent:2 order:0</a></li> <li>bmw - levelno:2 id:6 parent:2 order:1</a> <ul> <li>1 series - levelno:3 id:8 parent:6 order:0</a> <ul> <li>1 series d- levelno:0 id:14 parent:8 order:0</a></li> </ul> </li> <li>3 series - levelno:3 id:9 parent:6 order:1</a></li> <li>5 series - levelno:3 id:10 parent:6 order:2</a> <ul> <li>525 - levelno:4 id:11 parent:10 order:0</a></li> <li>m5 - levelno:4 id:12 parent:10 order:1</a></li> </ul> </li> </ul> </li> <li>noble - levelno:2 id:7 parent:2 order:2</a></li> </ul> </li> <li>vans - levelno:1 id:3 parent:1 order:1</a></li> <li>trucks - levelno:1 id:4 parent:1 order:2</a></li> </ul> <br>
i have found plenty of examples show how 1 child (two deep) or child child (three deep) nothing dynamic show 15 deep, if number of sub items added.
anyone have ideas on this?
i can alter code generating list, use css... can point me in right direction?
first of all, let me list that's infinitely big big ui uh-oh. deeper gets, less user friendly is.
that being said, have 1 of these such lists i'm nursing along until app can re-designed. former coworker opted output valid html nested ul's have done. presentation, nothing we've found can beat jquery superfish.
how deep go? infinite. i've seen @ 7 in app. again, if given choice, wouldn't it....but could.
why jquery when technically --could-- done pure css? progressive enhancement starters. low overhead graceful fallback. , presentation allows transitions, dynamic sizing of large elements, etc. it's code if had time build, deploy, , run several hundred unit tests.
all simple $('#id').superfish()
call.
Comments
Post a Comment