jQuery
【jQuery】クリック可能なレスポンシブメガメニューResponsive Mega Menu
February 1, 2017

Responsive Mega Menuはクリック可能なレスポンシブメガメニュー。
<a class="skip-to-content" href="maincontent">Skip to main content</a> <span class="jsHamburger"> <i class="fa fa-bars"></i> </span> <nav class="main-nav"> <ul> <li class="primary-nav-item"><a href="">Primary Nav Item 1</a> <ul class="submenu"> <li class="secondary-nav-item"><a href="">Secondary Nav Item 1</a> <ul> <li class="tertiary-nav-item"><a href="">Tertiary Nav Item 1</a></li> <li class="tertiary-nav-item"><a href="">Tertiary Nav Item 2</a></li> <li class="tertiary-nav-item"><a href="">Tertiary Nav Item 3</a></li> <li class="tertiary-nav-item"><a href="">Tertiary Nav Item 4</a></li> <li class="tertiary-nav-item"><a href="">Tertiary Nav Item 5</a></li> </ul> </li> <li class="secondary-nav-item"><a href="">Secondary Nav Item 2</a></li> <li class="secondary-nav-item"><a href="">Secondary Nav Item 3</a> <ul> <li class="tertiary-nav-item"><a href="">Tertiary Nav Item 1</a></li> <li class="tertiary-nav-item"><a href="">Tertiary Nav Item 2</a></li> </ul> </li> </ul> </li> <li class="primary-nav-item"><a href="">Primary Nav Item 2</a> <ul class="submenu"> <li class="secondary-nav-item"><a href="">Secondary Nav Item 1</a></li> <li class="secondary-nav-item"><a href="">Secondary Nav Item 2</a></li> <li class="secondary-nav-item"><a href="">Secondary Nav Item 3</a></li> <li class="secondary-nav-item"><a href="">Secondary Nav Item 4</a></li> <li class="secondary-nav-item"><a href="">Secondary Nav Item 5</a></li> </ul> </li> <li class="primary-nav-item"><a href="" >Primary Nav Item 3</a></li> <li class="primary-nav-item"><a href="" >Primary Nav Item 4</a></li> <li class="primary-nav-item"><a href="" >Primary Nav Item 5</a></li> </ul> </nav> <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.4/jquery.min.js"></script> <script src="megaMenu.js"></script>