jQuery

jQuery 関連のメモ

jQuery で画像をプリロード

2014年12月26日

画像ファイルを前もって読み込んでおくプリロードに関する個人的なメモ。 ロールオーバーなどにより画像を表示する場合、切り替える画像のロードに時間がかかり、画像がちらつくことがあるので、それらの画像ファイルを前もって読み込んでおく方法。 目次 基本的な構文 jQuery で前もって読み込んでおく画像ファイルを以下のように記述するだけ。 または、 これにより画像が…

続きを読む

jQuery プラグイン Masonry の使い方と設定

2014年12月6日

ブラウザの幅に応じて、配置した要素のレイアウトを整列してくれる jQuery プラグイン Masonry の使い方や設定に関する個人的なメモ。 Lazy Load や Magnific Popup も一緒に使ってみた。 この時点でのバージョン:v3.2.1 目次 jQuery プラグイン Masonry のダウンロード Masonry のページの「Downl…

続きを読む

jQuery プラグイン Lazy Load の使い方と設定

2014年11月30日

スクロールに応じて、画像データを遅延読込する jQuery プラグイン Lazy Load の設定と使い方に関する個人的なメモ。 Lazy Load プラグイン ページに含まれる画像のデータの読み込みを遅らせる(後から読み込ませる)ことにより、ロード時間を短縮することができるプラグイン。ビューポート(ブラウザの表示領域/画面)外の画像はユーザーがスクロールす…

続きを読む

position: fixed を使ってメニュー(ナビゲーション)を固定する際の注意点

2014年11月28日

position: fixed を使ってメニューを固定する際に気をつける点などの個人的なメモ。 結論から言うと、メニュー(ナビゲーション)の高さを指定し忘れるとメニュー以降に出現するリンク要素(ハイパーリンク)のリンクがクリックできなく(リンクが効かなく)なったり、ブラウザ上の文字(テキスト)を選択しようとしても選択できなくなってしまう。 関連ページ:「レス…

続きを読む

Slider Revolution / jQuery スライダープラグイン

2014年7月24日

レスポンシブ対応で多機能なスライダープラグイン Slider Revolution (Version 4.5 SkyWood) の使い方等に関するメモ。 価格:$12 ダウンロード(販売元):codecanyon Slider Revolution のダウンロード(購入)とインストールに関しては以下のページをご参照ください。 関連ページ:Slider Rev…

続きを読む

Slider Revolution / jQuery プラグインのダウンロードとインストール

2014年7月22日

jQuery のレスポンシブスライダープラグイン Slider Revolution のダウンロードとインストールに関するメモ。(Version 4.5 SkyWood) 価格:$12 ダウンロード(販売元):codecanyon どのようなスライダーが作成できるかは、Slider Revolution のサイトをご覧ください。 フル・レスポンシブ CSS …

続きを読む

jQuery レスポンシブ・スライダー bxSlider

2014年5月18日

レスポンシブ対応のスライダー「bxSlider」(v4.1.2) の使い方や設定に関するメモ。とても簡単に設置ができるが、指定するモードによっては、使用している CSS の関係でスライドの位置がずれてしまったりしたのでその対処法やオプションについて。 目次 bxSlider のダウンロードとインストール bxSlider のサイトの右上の「Download」…

続きを読む

JavaScript/jQuery を使ったブラウザ判定

2014年4月13日

時々使用するブラウザの判定、毎回調べているのでメモ。 「UserAgent での判定」、「サポートしている機能での判定」、「使いたい機能が機能するかでの判定」などがあるので用途に合わせて利用。 UserAgent での判定 UserAgent の文字列からブラウザを判定する方法。バージョンが新しくなったりすると UserAgent の値も変更されるようでこれ…

続きを読む

jQuery 要素の操作

2014年2月9日

jQuery で要素を操作する際に使用するメソッドに関するメモ。 要素にコンテンツを追加 ラップ集合の全要素(既存のコンテンツ)に対して渡されたコンテンツ(引数で指定した要素等)を追加するメソッドは以下のようなものがある。 append:コンテンツを要素の子要素の末尾に追加 prepend:コンテンツを要素の子要素の先頭に追加 after:コンテンツを要素の…

続きを読む

Magnific Popup を使ってみる

2014年2月7日

Youtube の動画を Lightbox のようなモーダルウィンドウで表示できるプラグインを探していたところ見つけた「Magnific Popup」。レスポンシブ・デザインに対応している上に機能も豊富で Goole map なども表示可能。使い方などに関するメモ。 目次 Magnific Popup のダウンロードと読み込み Magnific Popup …

続きを読む