Scribd
Upload
93 views1 page

Index 2

This document demonstrates how to create multi-level dropdown menus using HTML, CSS, and jQuery. It defines a .dropdown-submenu class to position submenus to the left of their parent menu items. JavaScript is also used to open submenus on click so that users can access lower levels.

Uploaded by

Aulia Rachman
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as TXT, PDF, TXT or read online on Scribd
93 views1 page

Index 2

This document demonstrates how to create multi-level dropdown menus using HTML, CSS, and jQuery. It defines a .dropdown-submenu class to position submenus to the left of their parent menu items. JavaScript is also used to open submenus on click so that users can access lower levels.

Uploaded by

Aulia Rachman
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as TXT, PDF, TXT or read online on Scribd
You are on page 1/ 1

<!

DOCTYPE html>
<html>
<head>
<meta name="viewport" conten<!DOCTYPE html>
<html>
<head>
<style>
.dropdown-submenu {
position: relative;
}

.dropdown-submenu .dropdown-menu {
top: 0;
left: 100%;
margin-top: -1px;
}
</style>
</head>
<body>

<div class="container">
<h2>Multi-Level Dropdowns</h2>
<p>In this example, we have created a .dropdown-submenu class for multi-level
dropdowns (see style section above).</p>
<p>Note that we have added jQuery to open the multi-level dropdown on click (see
script section below).</p>
<div class="dropdown">
<button class="btn btn-default dropdown-toggle" type="button" data-
toggle="dropdown">Tutorials
<span class="caret"></span></button>
<ul class="dropdown-menu">
<li><a tabindex="-1" href="#">HTML</a></li>

You might also like