株式会社オンズのブログ記事一覧
-
-
【WordPress】Jetpackの新機能「カスタム コンテンツ タイプ」の一覧を表示する方法。 ここでは、WordPress のプラグイン［Jetpack］のヴァージョン「3.1」以降から利用できるようになった［カスタム コンテンツ タイプ］を使用した際に、アーカイヴ・ページで［カスタム コンテンツ タイプ］の一覧を表示する方法を紹介... 【WordPress】Jetpackの新機能「カスタム コンテンツ タイプ」の一覧を表示する方法。続きを読む →
-
【CSS3】話題のパララックス効果をスクリプト無しで実装する方法。 昨年、2013年度あたりから普及し始め、今年も大流行したウェブデザインのテクニックの１つである［パララックス・スクロール］をCSS3だけで実装する方法を紹介します。 パララックス（Parallax）とは日本語に訳すと「視差効果」を意味し、主... 【CSS3】話題のパララックス効果をスクリプト無しで実装する方法。続きを読む →
-
-
【jQuery】要素をタイル状に並べるプラグイン［Freetile.js］の使い方。 グリッドに沿って要素をタイル状に並べる jQueryプラグインとして、これまでにも［Masonry］や［Isotope］を紹介してきました。 今日紹介する［Freetile.js］も、前者２つと同じような機能を備えたプラグインです。 まずは... 【jQuery】要素をタイル状に並べるプラグイン［Freetile.js］の使い方。続きを読む →
-
【.htaccess】拡張子が「.html」のファイルでPHPを動かす方法。 基本的に、PHPを動かすにはファイルの拡張子が「.php」でなくてはいけません。 しかし状況により、拡張子が「.html」のファイルでもPHPを動かしたいことがあります。 単純にファイルの拡張子を「.html」から「.php」に置き換えれば... 【.htaccess】拡張子が「.html」のファイルでPHPを動かす方法。続きを読む →
-
【CSS3】約60種類のエフェクトが使えるCSSライブラリ［Animate.css］が神懸かっている理由。 今日紹介する［Animate.css］は、アニメーションさせたい要素に任意のクラス名を追加するだけで、合計66種類のエフェクト効果を導入することができるCSSライブラリです。 http://daneden.github.io/animate... 【CSS3】約60種類のエフェクトが使えるCSSライブラリ［Animate.css］が神懸かっている理由。続きを読む →
-
-
【jQuery】スマートフォンやタブレット端末でのスクロールを無効にする方法。 各種スマートフォンやタブレット端末でのウェブ観覧時に、スワイプやフリック等のタッチコントロールによるウィンドウのスクロールを禁止する方法を紹介します。 パソコンの場合、CSSで「overflow:hidden;」を効かせれば、スクロールさせ... 【jQuery】スマートフォンやタブレット端末でのスクロールを無効にする方法。続きを読む →
-
-
【PHP】ループ処理［foreach］で最後だけ違う処理をする方法。 必要に迫られたので個人的な備忘録を兼ねて。 PHPでループ処理の［foreach］を扱う際に、最後のときだけ違う処理を施す方法を紹介します。 ここでは仮に、以下のような配列があると仮定します。 <?php $arr=array('月'... 【PHP】ループ処理［foreach］で最後だけ違う処理をする方法。続きを読む →
-
【jQuery】縦長のサイトを読み込んだときの表示位置をページトップにする 特にスマートフォン対応サイトなどで、縦スクロールが発生する縦長のサイトを読み込むと、初期表示の位置がページトップではなくページの途中から表示されてしまうケースがあります。 これはブラウザの仕様で、ウェブページをリロードした際に以前読み込んだ... 【jQuery】縦長のサイトを読み込んだときの表示位置をページトップにする続きを読む →
-
モバイルデバイス（iPad、iPhone等）でサイトを観覧時に、右側に空白ができてしまう時の解決策。 レスポンシヴデザインを採用したサイトに多く見られるのですが、iPadやiPhone、または各社のスマートフォン等のモバイルデバイスでの観覧時に、ウィンドウの右側、あるいはコンテンツの右側に、意図していない余分な空白ができてしまうことがありま... モバイルデバイス（iPad、iPhone等）でサイトを観覧時に、右側に空白ができてしまう時の解決策。続きを読む →
-
【PHP】Basic認証で保護されているファイルをPHPで認証突破する方法。 単純に、PHPを使ってBasic認証を突破する方法を紹介します。 もちろん、IDとPASSWORDがわかっていることが前提です。 仮に、［sample.com］というサイトに、ベーシック認証で保護された［test.php］というファイルが存... 【PHP】Basic認証で保護されているファイルをPHPで認証突破する方法。続きを読む →
-
-
【jQuery】フィルターやソート機能にも対応したMasonry風jQueryプラグイン［Isotope］の使い方。 グリッドに沿って各要素をタイル状にレイアウトするプラグインで、有名なものでは［jQuery Masonry］が挙げられます。 この分野のjQueryプラグインでは最も知名度が高く、初心者の方でも比較的簡単に導入できるので、使っている方も多い... 【jQuery】フィルターやソート機能にも対応したMasonry風jQueryプラグイン［Isotope］の使い方。続きを読む →
-
【CSS3】［display:table-cell;］に［margin］を指定したい場合の処理。 CSS3 から使えるようになった新しいプロパティ display:table; とdisplay:table-cell; は、これまで［float］を使って組んでいたレイアウトを、より直感的に、より簡単に実現できるので大変便利です。 しかし... 【CSS3】［display:table-cell;］に［margin］を指定したい場合の処理。続きを読む →
-
【jQuery】「$(document).ready()」と「$(window).load()」の違いを極める！［jQuery3.0以降対応］ jQuery を扱うとき、多くは下記のようなコードで実装していると思います。 $(function() { // ここに処理内容を書く }); ここで使われる「$(function(){〜});」は略式で、展開すると $(document)... 【jQuery】「$(document).ready()」と「$(window).load()」の違いを極める！［jQuery3.0以降対応］続きを読む →
-
-
【PHP】時間帯ごとに表示内容を変更する方法 ホームページの中で、時間帯によって表示内容を変更したい箇所がある場合、PHPを使うことで簡単に解決することができます。 PHP には日付や時間を扱う［date()関数］と呼ばれる機能があるので、それを用いて時間を取得して、朝と夜でサイトのイ... 【PHP】時間帯ごとに表示内容を変更する方法続きを読む →
-
-
-
【jQuery】間違えやすい「$(this)」と「this」の使い方とは？ jQuery でプログラムを書いている際に「$(this)」と「this」の使い方で一瞬戸惑うことがありませんか？ 基本的に「this」のほうは［DOMエレメント］で、イベントハンドラの「this」はそのイベントが発生した要素になり、「ea... 【jQuery】間違えやすい「$(this)」と「this」の使い方とは？続きを読む →
-
【CSS】長めのURL等の記述が枠からハミ出してしまう際の自動折り返しの設定方法。 HTML で長めの URL を記述した際に、親要素のボックスからハミ出してしまうことがあります。 そんなとき、CSS の設定で自動で折り返しをさせる方法が存在します。 使用するのは以下のスタイル。 word-wrap:break-word;... 【CSS】長めのURL等の記述が枠からハミ出してしまう際の自動折り返しの設定方法。続きを読む →
