ajaxzip3は、フォーム内の郵便番号を入力すると、自動で住所を補完してくれるJavaScriptのライブラリです。 郵便番号を入れるとリアルタイムで住所が入力されます。 ajaxzip3の使い方 ajaxzip3の設…
リアルタイムで郵便番号から住所を自動入力してくれるJavaScriptライブラリ「ajaxzip3」
横並びにした要素の高さをjQueryを使って揃える方法
jQueryを使って横並びにした要素の高さを揃える方法をご紹介いたします。 例えば、”display: inline-block;”で要素を横並びにした場合、中に入る文章量などがバラバラだと高さも…
jQueryを使って要素のフィルタリング機能を実装する方法
jQueryを使って、フィルタリング機能を実装する方法をご紹介いたします。要素をグループ分けし、各グループ毎に要素の絞り込みを行います。 簡単なデモを用意したので、挙動については以下よりご確認ください。 デモを見る jQ…
フィルタリング機能も使える！Masonry風のグリッドレイアウトに要素を並べ替えてくれるjQueryプラグイン「Isotope」
Isotopeは、要素をMasonry風のグリッドレイアウトに並べ替えてくれるjQueryプラグインです。フィルタリング機能も使えます。 フィルタリング機能の挙動や各種オプションの使い方については、公式サイトでご確認いた…
他のページからのアクセス時に特定のタブコンテンツを開く方法
以前、タブ切り替え型のコンテンツを作成する方法をご紹介いたしました。 通常、他のページからタブが設置されたページにアクセスすると、1つ目のタブがアクティブな状態になります。ですが、他のページからアクセスした時に、指定した…
imgタグで設置したSVGファイルをインラインSVGに変換してくれるJavaScriptライブラリ「deSVG」
deSVGは、imgタグで設置しているSVGファイルをインラインSVGに変換してくれるJavaScriptライブラリです。 SVGの色をCSSで変更しようと思った場合、imgタグで設置されているSVGファイルは変更できず…
jQueryを使ってボタンをクリックする度に要素のテキストを切り替える方法
jQueryを使って、ボタンをクリックする度に要素の中のテキストを切り替える方法をご紹介いたします。 例えば、「開く」と書かれたボタンをクリックすると、テキストを「閉じる」に切り替えたい時などに便利です。 jQueryを…
アニメーションGIFをマウスホバーやクリックで再生・停止できるようになるJavaScriptライブラリ「Freezeframe.js」
Freezeframe.jsは、マウスホバーやクリックによってアニメーションGIFの再生・停止を制御できるようにするJavaScriptライブラリです。 以下のデモページで挙動を確認できます。 デモページを見る Free…
YouTube動画や画像をポップアップ表示できるjQueryプラグイン「Lity」
Lityは、YouTube動画や画像などをポップアップで表示できるjQueryプラグインです。動画や画像のリンクをクリックすることで、いわゆるモーダルウインドウとして表示させることができます。 配布サイトでデモが用意され…
IE11でもpicture要素を使えるようにするポリフィル「Picturefill.js」
Picturefill.jsは、picture要素に対応していないブラウザでもpicture要素による画像の切り替えができるようになるポリフィルです。 picture要素を使うことで、ブラウザの幅によって画像を出し分ける…