※2018/11/09追記 Watermarkの配布ページはなくなっていました。提供終了したようです。 Watermarkは、画像に透かしを入れることができるjQueryプラグインです。 プラグインの配布ページでデモを確…
画像に透かしを入れることができるjQueryプラグイン「Watermark」
全画面もしくは指定した要素全体に背景画像を表示することができるjQueryプラグイン「BACKSTRETCH」
BACKSTRETCHは、ウインドウ全体もしくは指定要素の全体に背景画像を表示することができるjQueryプラグインです。 デモは、ダウンロードページのDemosでご確認いただけます。 BACKSTRETCHの使い方 ダ…
スクロール量をプログレスバーで表示してくれるjQueryプラグイン「Scrollgress」
Scrollgressは、ページのスクロール量をプログレスバーで視覚的にわかりやすく表示してくれるjQueryプラグインです。 動作については、デモページをご参照ください。スクロール量に応じて、ページ上部にプログレスバー…
サイト閲覧時にスクロール量を表示してくれるjQueryプラグイン「Scrolline.js」
Scrolline.jsは、ページ全体のどこまでスクロールしているかを、視覚的にわかるように表示してくれるjQueryプラグインです。 動きについては、デモページをご参照ください。ページの上部に、緑色のバーでスクロール量…
スクリプトを読み込むだけでYouTubeなどの埋め込み動画をレスポンシブ対応してくれる「superembed.js」
superembed.jsは、読み込むだけでYouTubeやVimeoなどの埋め込み動画をレスポンシブ対応してくれるスクリプトです。特定のクラスでiframeを内包したり、jQueryをロードする必要がない、独立した軽量…
サイトの読み込み中にローディング画面を表示する方法
サイトにアクセスした時に、ページの読み込みが完了するまでローディング画面を表示する方法をご紹介いたします。 デモページを用意したので、動きについてはデモをご参照ください。 デモページを見る サイトの読み込み中にローディン…
jQueryを使って電話発信用のリンクをスマホ以外で無効化する方法
a要素に「tel:0312345678」というような電話番号を入れることで、そのリンクをタップした時に電話をかけることができるようになります。 PCで閲覧している時には、このリンクを無効化しておきたい場合もあるかと思いま…
指定した数まで数字をカウントアップさせることができるjQueryプラグイン「jquery.animateNumber」
jquery.animateNumberは、指定した数まで数字の部分をアニメーションでカウントアップさせることができるjQueryプラグインです。 動きについては、jquery.animateNumberの配布ページをご…
jQueryを使って指定した文字数でテキストを省略する方法
Webサイト内の特定の箇所で、文字数の上限を決めて、それ以降は省略したいということもあるかと思います。 そんな時のために、jQueryを使って、指定した文字数以上になったらテキストを省略する方法をご紹介いたします。 jQ…
jQueryを使ってスマホの時だけ左サイドバーをメインコンテンツの下に配置する方法
例えば、以下のようなレイアウトのPCサイトがあったとき、これをレスポンシブ化してスマホ対応する場合、あなたならどうやって対応しますか？ 以下のようにコーディングされていれば、contentとsidebarの横幅を広げてワ…