Main » Articles » Web tutorijali » Navigacija |
Horizontalni padajući meni (jquery + css)
Ovaj tutorijal će vas naučiti kako da primenite padajući meni sa sajta http://www.sohtanaka.com/web-design/examples/drop-down-menu/ . 1. Skinemo rar folder sa svim fajlovima. 2. Ekstraktujemo u rut direktorijum vašeg sajta (/) 3. Sledeci kod ubacimo izmedju i u vasoj html stranici gde zelite da vam se nalazi meni. Code <link href="css/horizontalnimeni.css" rel="stylesheet" type="text/css" /> <script type="text/javascript" src="http://code.jquery.com/jquery-latest.js"></script> <script type="text/javascript" src="js/horizontalnimeni.js"></script> 4. Kod menija ubacujemo izmedju i : Code <ul class="topnav"> <li><a href="#">Home</a></li> <li> <a href="#">Tutorials</a> <ul class="subnav"> <li><a href="#">Sub Nav Link</a></li> <li><a href="#">Sub Nav Link</a></li> </ul> </li> <li> <a href="#">Resources</a> <ul class="subnav"> <li><a href="#">Sub Nav Link</a></li> <li><a href="#">Sub Nav Link</a></li> </ul> </li> <li><a href="#">About Us</a></li> <li><a href="#">Advertise</a></li> <li><a href="#">Submit</a></li> <li><a href="#">Contact Us</a></li> </ul> Izmena menija i dodavanje vasih linkova: Code <li><a href="#">Home</a></li> Code <li> <a href="#">Tutorials</a> <!-- 1 nivo --> <ul class="subnav"> <li><a href="#">Sub Nav Link</a></li> <!-- 2 nivo 1 elemenat --> <li><a href="#">Sub Nav Link</a></li> <!-- 2 nivo 2 elemenat --> </ul> </li> | |
Views: 2978 | | |
Total comments: 0 | |