jquery toggle use nav bar basic

<html> <head> <title></title> <link rel="stylesheet" href="bootstrap/css/bootstrap.min.css"> <style type ="text/css"> .nav-bar { background: purple; padding: 20px; } .nav-bar ul li a{ color:white; font-style:bold; font-size: 20px; } .nav-bar ul{ text-align: center; } </style> </head> <body> <div class = "nav-bar"> <ul class="list-inline"> <button class="menu">menu</button> <li><a href="#">Home</a></li> <li><a href="#">About</a></li> <li><a href="#">Contact</a></li> <li><a href="#">Services</a></li> </ul> </div> </div> <script src="jquery-3.3.1.min.js"></script> <script> $(".menu").click(function() { $("li").toggle(); }); </script> </body> </html>

Be the first to comment

You can use [html][/html], [css][/css], [php][/php] and more to embed the code. Urls are automatically hyperlinked. Line breaks and paragraphs are automatically generated.