最近の覚書やメモ

Web 制作に関する個人的な覚書やメモです。記事中の内容やコード等には、誤りなどもある可能性があることをご了承ください。また、内容を利用される場合は、あくまでもご自身の責任においてご利用ください。

New Web 制作リファレンス
もう少し整理された形式のWeb制作参考資料です。

jquery jQuery fancyBox v1.3.4 の使い方や設定

2014年12月29日

jQuery fancyBox v1.3.4 の使い方や設定に関する個人的なメモ。 fancyBox は v2.x からライセンスが変わり、商用(営利目的)の場合は有料となっているため、古いバージョンを探したら以下のサイトにあった。このサイトと本家(?)の fancyBox との関係は不明。 http://fancybox.net v1.3.4 のライセンス…

続きを読む

jquery jQuery fancyBox v2 の使い方や設定

2014年12月29日

jQuery プラグイン fancyBox の基本的な使い方や設定に関する個人的なメモ。この時点での fancyBox のバージョンは「v2.1.5」。 関連ページ:「jQuery fancyBox v1.3.4 の使い方や設定」 目次 jQuery プラグイン fancyBox のダウンロード fancyBox のページの「license & d…

続きを読む

htmlcss スマホのレスポンシブデザインで右側に余白ができる場合

2014年12月27日

レスポンシブのサイトを作成していたら、何故かスマホのサイズの場合のみ、右側に余白(空間)ができていた。 HTML の構造は以下のようなもの。 CSS は以下のようなもの(関連部分抜粋) #header の幅は 100% に指定してあるのに、いくつかのページのみスマホのサイズでヘッダーの右側に余白ができる。よく見るとヘッダー部分のみではなく全体に余白ができてい…

続きを読む

jquery jQuery で画像をプリロード

2014年12月26日

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

続きを読む

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

2014年12月6日

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

続きを読む

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

2014年11月30日

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

続きを読む

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

2014年11月28日

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

続きを読む

htmlcss HTML5 の構造

2014年11月8日

HTML5 文書の構造や新しい要素に関する個人的なメモ。 参考: 「入門 HTML5(オライリー)」 「TAG index Webサイト」 「HTML5のセクションで“文書構造”を理解する atmarkIT」 目次 DOCTYPE HTML5 の DOCTYPE は以下のようになる。 DOCTYPE は HTML ファイルの最初の行に存在する必要がある。 そ…

続きを読む

htmlcss HTML5 の機能検出

2014年10月25日

HTML5 の機能を検出する方法の個人的なメモ。 参考:「入門 HTML5(オライリー)」 目次 Modernizr Modernizr は HTML5 と CSS3 の機能のサポートを検出してくれる JavaScript ライブラリ。(これを利用するのが一番簡単だと思う) Modernizr は読み込まれると、Modernizr という名前の JavaSc…

続きを読む

wordpress WordPress の表示が遅くなったので Debug Bar で調べてみた際のメモ

2014年10月12日

いつからから不明だが、気が付くといくつかのページの表示が恐ろしく時間がかかる(1分以上)ようになっていた。 結果的には「Debug Bar」と「Debug-Bar-Extender」というプラグインを使って切り分けたところ原因を特定できたけど、遠回りをしてしまった感もないではない。 取りあえずやってみたことをメモ。 注意事項:プラグインのインストールの前には…

続きを読む