sandy1028 Posted July 23, 2007 Share Posted July 23, 2007 Hi, How to display the tree format using the horizontal and verticle lines which is connected from parent node to child node.... Please provide me ideas how it can be displayed Quote Link to comment Share on other sites More sharing options...
ToonMariner Posted July 24, 2007 Share Posted July 24, 2007 only thing I can think of - and its probably not ideal but still fairly simple.... <ul> <li class="live">1 <ul> <li class="live">1.1 <ul> <li>1.1.1</li> </ul> </li> <li>1.2</li> </ul> </li> <li>2</li> </ul> ul { border-left: 1px dotted #666; } li.live { background: transparent url(path/to/closed/image) no-repeat 0 10px; } ul li ul { display: none; } li.live { li.live { background: transparent url(path/to/open/image) no-repeat 0 10px; } li.live ul { display: block; } Have a play around with that - and create images that you want to show the item is open... Quote Link to comment Share on other sites More sharing options...
sandy1028 Posted July 25, 2007 Author Share Posted July 25, 2007 Hi, I am getting extra dotted line how to remove it and how to draw the horizontal dotted line <style> ul { border-left: 1px dotted #666; } li.live { background: transparent url(path/to/closed/image) no-repeat 0 10px; } ul li ul { display: none; } li.live { li.live { background: transparent url(path/to/open/image) no-repeat 0 10px; } li.live ul { display: block; } </style> <ul> <li class="live">1 <html> <body> <ul> <li class="live">1.1 <ul> <li>1.1.1</li> </ul> </li> <li>1.2</li> </ul> </li> <li>2</li> </ul> </body> </html> Quote Link to comment Share on other sites More sharing options...
sandy1028 Posted July 25, 2007 Author Share Posted July 25, 2007 Hi, How to draw the horizontal line in connecting the parent node and child node Quote Link to comment Share on other sites More sharing options...
ToonMariner Posted July 25, 2007 Share Posted July 25, 2007 that is the backgorund images that you need to create... Quote Link to comment Share on other sites More sharing options...
sandy1028 Posted July 26, 2007 Author Share Posted July 26, 2007 Hi, I created the background image but it is placed next to the minus.png..... If I set the position the image it is not aligned to bottom of the child node Quote Link to comment Share on other sites More sharing options...
ToonMariner Posted July 26, 2007 Share Posted July 26, 2007 keep playing till you get what you want Quote Link to comment Share on other sites More sharing options...
Recommended Posts
Join the conversation
You can post now and register later. If you have an account, sign in now to post with your account.