← Back
Editing: demo.html
<!DOCTYPE html> <html> <head> <title>jQuery slimMenu</title> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <link rel="stylesheet" type="text/css" href="dist/css/slimmenu.min.css"> <style> body { font-family: 'Lucida Sans Unicode', 'Lucida Console', sans-serif; padding: 0; } a, a:active { text-decoration: none } </style> <script src="dist/js/jquery-1.11.3.min.js"></script> </head> <body> <ul class="slimmenu"> <li> <a href="#">Slim Menu 1</a> <ul> <li> <a href="#">Slim Menu 1.1</a> <ul> <li><a href="#">Slim Menu 1.1.1</a></li> <li> <a href="#">Slim Menu 1.1.2</a> <ul> <li><a href="#">Slim Menu 1.1.2.1</a></li> <li><a href="#">Slim Menu 1.1.2.2</a></li> </ul> </li> </ul> </li> <li><a href="#">Slim Menu 1.2</a></li> </ul> </li> <li><a href="#">Slim Menu 2</a></li> <li> <a href="#">Slim Menu 3</a> <ul> <li> <a href="#">Slim Menu 3.1</a> <ul> <li><a href="#">Slim Menu 3.1.1</a></li> <li><a href="#">Slim Menu 3.1.2</a></li> </ul> </li> <li><a href="#">Slim Menu 3.2</a></li> </ul> </li> <li><a href="#">Slim Menu 4</a></li> </ul> <script src="dist/js/jquery.slimmenu.min.js"></script> <script src="dist/js/jquery.easing.min.js"></script> <script> $('.slimmenu').slimmenu( { resizeWidth: '800', collapserTitle: 'Main Menu', animSpeed:'medium', indentChildren: true, childrenIndenter: '»' }); </script> </body> </html>
Save File
Cancel