jQuery

【jQuery】レスポンシブメニュープラグインMenu Lateral

August 7, 2016

Menu LateralはレスポンシブでHTML5, CSS3,jQueryで実装されたメニュープラグイン

CSS&JS

<script type="text/javascript" src="./js/jquery.js"></script>
<script type="text/javascript" src="./js/main.js"></script>
<link rel="stylesheet" href="./css/menu.css">
<link rel="stylesheet" href="./css/boot.css">

HTML

	<body class="bg-teste">
		<header>
			<input type="checkbox" id="btn-menu">
			<label for="btn-menu" class="abreMenu"><img src="./img/menu.png" width="20" height="20"></label>

			<nav class="menu-principal">
				<div class="menu-avatar">
					<img src="./img/avatar.gif" alt="" />
					<span>Rodrigo Soares</span>
				</div>
				<ul>
					<li><a href="#">Home</a></li>
					<li class="submenu"><a href="#">Categoria</a>
						<ul>
							<li><a href="#">Inicio</a></li>
							<li><a href="#">Meio</a></li>
							<li><a href="#">Fim</a></li>
						</ul>
					</li>
					<li><a href="#">Contato</a></li>
					<li><a href="#">Sobre</a></li>
				</ul>
			</nav>
		</header>
	</body>

Download