Создание скрипта для показа списка с гиперссылками
Есть вот такой список:
<nav class="navigation"> <ul> <li><a href="">item 1</a> <ul> <li><a href="">sub item 1-a</a></li> <li><a href="">sub item 1-b</a></li> </ul> </li> <li><a href="">item 2</a> <ul> <li><a href="">sub item 2-a</a></li> <li><a href="">sub item 2-b</a></li> </ul> </li> </ul> </nav> И такой скрипт (взят из примера JQuery): function handler( event ) { var target = $( event.target ); if ( target.is( "li" ) ) { target.children().toggle(); } } $( "ul" ).click( handler ).find( "ul" ).hide(); Как сделать так, чтобы он работал со вложенными внутри элементов "li" гиперссылками? Чтоб показывал контент при клике на них? |
|
Цитата:
Забыл дописать: открытая менюшка только по повторному клику на заголовок должна сворачиваться. |
Alex137a1,
<!DOCTYPE HTML> <html> <head> <title></title> <meta charset="utf-8" /> <style type="text/css"> li ul { display: none; } </style> <script src="https://code.jquery.com/jquery-latest.js"></script> <script type="text/javascript"> $(function () { $('ul').prev('a').on('click', function (event) { event.preventDefault(); $(this).next("ul").slideToggle() ; }); }); </script> </head> <body> <nav class="navigation"> <ul> <li><a href="">item 1</a> <ul> <li><a href="">sub item 1-a</a></li> <li><a href="">sub item 1-b</a></li> </ul> </li> <li><a href="">item 2</a> <ul> <li><a href="">sub item 2-a</a></li> <li><a href="">sub item 2-b</a></li> </ul> </li> </ul> </nav> </body> </html> |
Цитата:
|
Часовой пояс GMT +3, время: 18:58. |