[CSS]見た目は普通、でもエフェクトが抜群にかっこいいナビゲーションのデモ
ぱっと見、よく見かけるレスポンシブ対応のナビゲーションのようなUIですが、かなりかっこいいエフェクトが仕込まれているデモを紹介します。 スクリプト無し、エフェクトはスタイルシートのみで実装されています。 左上のアイコンをクリック・タップすると、オーバーレイでナビゲーションがダイナミックなアニメーションで表示されます。 ふわっとナビゲーションのアイテムが集まってくるの、かっこいいですね。 解除して散っていくのも！ 実際のデモは、こちらからどうぞ。 Chrome, Safariでご覧ください。 デモページ これをベースにいろいろなアイデアが膨らんできますね。 参考までに、実装もご紹介。 HTML オーバーレイでステイになるのは、チェックボックスを使用しています。 <!-- start header --> <header id="head"> <div class="container"> <
[JS]フェードで表示・非表示するFAQコンテンツをシンプルなコードで実装するチュートリアル
jQueryを使って、FAQのAnswerをフェードで表示・非表示を切り替えるコンテンツをシンプルなコードで実装するチュートリアルを紹介します。 Questionクリック時 実装 Step 1: 外部ファイル 「jquery.js」を外部ファイルとして記述します。 <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script> Step 2: HTML 質問はh3要素、回答はp要素で実装し、div要素で内包します。 <div id="w"> <h2>User Accounts</h2> <div class="q"> <h3 class="qhead"><a href="#q01">よくある質問</a></h3> <div clas
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
