今日の人気記事

まだデータがありません。

メニューをドロップダウンに変えるレスポンシブ「Convert a Menu to a Dropdown」

当ページのリンクには広告が含まれています。

スポンサーリンク

メニューをドロップダウンに変えるレスポンシブjQueryプラグイン「Convert a Menu to a Dropdown」の紹介です。

jQueryプラグイン「Convert a Menu to a Dropdown」

レスポンシブとは、PC・スマートフォン・タブレットなどのあらゆる端末に対応する制作手法です。今回紹介するConvert a Menu to a Dropdownは、レスポンシブなメニューを制作するのを補助してくれます。便利です。

スポンサーリンク

まずはデモをご覧ください。ブラウザの横幅を縮めると……。メニューがドロップダウンに早変わり!

「Convert a Menu to a Dropdown」のデモ

デモのソース(HTML + jQuery)

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8" />
<title>Convert Menu to Dropdown - jQueryプラグインまとめのコピペ</title>
<link href="style.css" type="text/css" rel="stylesheet"/>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js" type="text/javascript"></script>
<script type="text/javascript" src="convert-menu-to-dropdown.js"></script>
</head>
<body>
<h1>Convert Menu to Dropdownのデモでーす。</h1>
<nav> 
<ul> 
<li><a href="#" class="active">Home</a></li> 
<li><a href="#">Blog</a></li> 
<li><a href="#">About</a></li> 
<li><a href="#">Support</a></li>
<li><a href="#">Contact</a></li> 
</ul>
</nav>
<p>ブラウザの横幅を縮めてください。980pxより小さくなると……。</p>
</body>
</html>
スポンサーリンク

関連記事(一部広告含む)