Webサイト内の特定の箇所で、文字数の上限を決めて、それ以降は省略したいということもあるかと思います。 そんな時のために、jQueryを使って、指定した文字数以上になったらテキストを省略する方法をご紹介いたします。 jQ…
jQueryを使ってスマホの時だけ左サイドバーをメインコンテンツの下に配置する方法
例えば、以下のようなレイアウトのPCサイトがあったとき、これをレスポンシブ化してスマホ対応する場合、あなたならどうやって対応しますか? 以下のようにコーディングされていれば、contentとsidebarの横幅を広げてワ…
HTML要素にスクロールエフェクトを追加できるjQueryプラグイン「ScrollMe」
ScrollMeは、HTML要素に対して、ズームや回転などのスクロールエフェクトを加えることができるjQueryプラグインです。 今回は、このScrollMeの使い方について解説したいと思います。スクロールエフェクトの動…
アメブロのPR非表示も紹介!RSSから記事の一覧を出力することができるjQueryプラグイン「zRSSFeed」
zRSSFeedは、RSSのフィードを取得して、記事の一覧を出力することができるjQueryプラグインです。外部サイトの記事一覧を簡単に表示することができます。 zRSSFeedの使い方 ステップ1. zRSSFeedの…
ブラウザのタブに表示されるWEBページのタイトルをスクロールさせる方法
WEBサイトを開くと、そのページの<title>タグがブラウザのタブに表示されます。このタブに表示されたタイトルをスクロールしながら動くようにする方法を紹介いたします。 動きについては以下デモページをご参照く…
指定した要素の背景画像をスライドショーにすることができるjQueryプラグイン「BgSwitcher」
BgSwitcherは、スライドショーのように背景画像を切り替えることができるjQueryプラグインです。 画面いっぱいの背景画像をスライドさせるプラグインはよくありますが、BgSwitcherは背景のサイズに合わせてス…
レスポンシブサイトでもクリッカブルマップが使えるようになるjQueryプラグイン「jQuery RWD Image Maps」
画像の好きな位置にリンクを仕込むことができるクリッカブルマップ。非常に便利ではあるのですが、レスポンシブのように画像などがデバイスサイズに合わせて可変するサイトでは、マップの座標がずれてリンクの位置が変わってしまいます。…
フォームでスペースのみが入力された時に、jQueryを使って拒否する方法
名前や住所などを入力してもらうフォームにて、テキストボックスを必須項目に設定していてもスペースを1つだけ入れると、すり抜けてしまうケースがあります。 そんな時に便利な、スペースのみの入力を拒否する方法を紹介したいと思いま…
フォームに入力した郵便番号から住所を自動入力してくれるjQueryプラグイン「jquery.jpostal.js」
jquery.jpostal.jsは、フォームで入力した郵便番号から住所を自動的に取得してくれるjQueryプラグインです。フォームで住所を入力してもらう時に、郵便番号を入れるだけで住所欄に住所を自動入力してくれるので、…
簡単にヘッダー固定の追尾型ナビゲーションを実装できるjQueryプラグイン「Clingify」
Clingifyは、ヘッダーに固定されたスクロール追尾型のナビゲーションを実装することができるjQueryプラグインです。最近よく見かけますね。 デモは、以下のページで確認できます。下にスクロールしていくと、ヘッダー部分…