ワードプレスのプラグインやJQueryプラグインなど、そのほかにもたくさんありますが、WEBの世界はいろんな方が開発したコードを無料で使っていいよと提供してくださっています。
とてもありがたいです。
なのでそういったプラグインをなるべく使い、安く制作することができます。
ここでは自分の備忘録も兼ね、いろいろなプラグインとその機能をご紹介します。
更新しても更新する前の情報をそのままに残す jquery.cookie.js
例えばクリックで開閉するボックスを開いたままページを更新したり、別のページに移動したりできます。
ダウンロードはこちら:https://github.com/carhartl/jquery-cookie
お問い合わせフォームなどで、間違いがあったらエラーメッセージを表示してくれる validation.js
お問い合わせフォームなどで、間違いがあった時、入力ボックスから離れたときにエラーメッセージを表示してくれるjQueryプラグイン。
ダウンロードはこちら: http://jqueryvalidation.org/
スクロールのスピードを調整し、パララックスサイトを作る jquery.stellar.js
背景の動かすスピードをずらして立体的に見せる。今年のはやりですね。
デモサイト:http://markdalgleish.com/projects/stellar.js/demos/
ダウンロードはこちら;https://github.com/markdalgleish/stellar.js
アニメーション動作に変化をつける easing.js
動作の例はこちら:http://gsgd.co.uk/sandbox/jquery/easing#examples
ダウンロードはこちら:http://gsgd.co.uk/sandbox/jquery/easing
ブラウザの HTML5, CSS3 対応状況を調べ、それに合わせたCSS.JSを書ける Modernizr.js
新たな機能がどんどん追加されてうれしい反面、対応してないブラウザへの配慮が大変です><
Modernizr.jsは対応しているかどうかを調べ、対応していなければ対応していないブラウザ専用のCSSやJSを呼び出してくれるので便利です。
ダウンロードはこちら:https://modernizr.com/
多階層レスポンシブナビゲーション
こちらはいろいろあります。
各デモとダウンロードページの紹介
メガメニュー用ナビゲーション Mega-Site Navigation
https://codyhouse.co/demo/mega-site-navigation/index.html
シンプル! Pushy
https://www.christopheryee.ca/pushy/
左右上下どっからでも出てこれる! Drawer
http://git.blivesta.com/drawer/
左右上下どっからでも出てこれる! mmenu
http://mmenu.frebsite.nl/examples.html
軽量レスポンシブナビゲーション
超軽量(1KB)ナビゲーション Responsive Nav
http://responsive-nav.com/demo/