タグ

jQueryとJSに関するken6021のブックマーク (2)

  • たった10行でできる!ドロワーメニューの作り方

    今流行のドロワーメニュー。ハンバーガーマークを押したらニョキッと出てきてバッテンを押したらニョキッといなくなるやつです。 ソースはたくさん落ちていて、それ使っても良かったんですが軽量にしたかったのと、あまり機能もいらなかったので自分で書いてみました。 コンテンツ部分がグインっと動いたりしません。コンテンツにメニューがかぶさるだけです。 サンプルページ ソースダウンロード(ZIP) ※今回紹介するソースではWindowの右から出てきます。 スクリプト 使うのはこの10行。 ※jQueryを読み込んでおいてくださいね。 $(function($) { WindowHeight = $(window).height(); $('.drawr').css('height', WindowHeight); //メニューをwindowの高さいっぱいにする $(document).ready(funct

    たった10行でできる!ドロワーメニューの作り方
  • 【jQuery】モーダルウィンドウによる年齢認証の作り方 | KLUTCHE

    以前紹介したCookieを使って、モーダルウィンドウの年齢認証を作成する方法の改良版です。 改良点 Javascript がぐっと短くなりました。 CSS によるレイアウト変更が容易になりました。 必要な機能をしぼって、軽量かつ汎用的にしてみました。 まずはデモ デモページ 五木川ダムの渋い魅力はアダルトな感じがするので、年齢認証を設置してみました。 モーダルウインドウは、シックに単色背景透明で作ってみましたが、見た目はCSSで自由に変更できます。 必要なもの Javascript を3つ使います。 ・jQuery ・jquery.cookie.js ・modalConfirm.js jQueryはGoogleライブラリから直接読み込みましょう。 のこり2つのファイルはアップロードしてヘッダ内で読み込みます。 <script type="text/javascript" src="http

  • 1