• RSS
[JS]jQueryのスムーススクロールで着地点の位置を微妙にずらす方法

jQueryのスムーススクロールを使って指定の場所へページ内遷移した時、アンカー名から上下に位置にずらして着地させる方法のご紹介です。

例えばヘッダーがページ上部に固定されていて、ヘッダーの高さ分だけ着地点を調整しないといけないような場合に便利なカスタマイズです。
続きを読む

[JS]特定の要素の<a>タグを除外してスムーススクロールをする方法

jQueryのスムーススクロールを使うことはよくあるのではないかと思いますが、今回は指定したクラスの<a>タグをスムーススクロールから除外する方法を紹介させていただきます。
続きを読む

[JS]一定量スクロールしてから「ページの先頭へ」ボタンを表示する方法

jQueryで、ページをスクロールしたら「ページの先頭へ」のリンクを表示/非表示する方法のご紹介です。

「ページへ先頭へ」リンクは、ページを開いた時には表示されませんが、少しスクロールする(今回の例ではページ上部から100px)とフェードインで表示され、リンクを踏んでページ先頭へ戻るとフェードアウトで非表示になる、という動きになります。
続きを読む

[JS]jQueryでフォームへテキストのペーストを禁止する方法

input type=”text”などのフォームへテキストをペーストさせないように、jQueryで制御する方法のご紹介です。
続きを読む

[JS]背景画像にスライドやフェードの動きを付与できる「jQuery.BgSwitcher」

複数の背景画像をスライドで横に動かしたり、フェードイン、フェードアウトで切り替えたりすることができるjQueryプラグイン「jQuery.BgSwitcher」のご紹介です。
続きを読む

[JS]jQueryでローディング画面を実装する方法

ページを読み込む際に、jQueryでローディング画面を実装する方法のご紹介です。
続きを読む

[JS]jQuery のアラートで「OK」ボタンクリック時に指定のページへ遷移させる方法

以前にJavaScript による確認アラートの表示方法 で紹介させていただいた記事の関連になりますが、

今度はjQueryで、フォームなどで「入力内容を確認する」ボタンをクリックした際に、アラートを立ち上げて「OK」ボタンか「キャンセル」ボタンをクリックさせる方法のご紹介です。
続きを読む

[JS]jQuery で複数の要素に同じ処理をする方法

セレクタで複数の要素を指定するには、HTML要素やID、クラス属性などをカンマ(,)でつなぎます。
続きを読む

[JS]jQuery による全角・半角文字列の変換について

以前に jQueryで replace() を使って特定の文字列を置換する方法 で紹介させていただいた記事の関連になりますが、フォーム周りでもよく利用される「jQueryによる全角と半角の置換」についてのメモです。
続きを読む

[JS]video タグの埋め込み動画をColorbox を使って再生する方法

前回の video タグでmp4 動画をサイトに埋め込む の方法で、video タグでmp4 動画を埋め込む方法を紹介させていただきましたが、今回は埋め込んだ動画をColorbox のインラインで表示(再生)させるカスタマイズのご紹介です。
続きを読む

[JS]JavaScript による確認アラートの表示方法

メールフォームなどのページで、「入力内容を確認する」ボタンをクリックしたらアラートを立ち上げて、「OK」か「キャンセル」ボタンをクリックさせる方法のご紹介です。
続きを読む

[JS]replace() を使って複数組の文字列を置換する方法

以前に jQueryで replace() を使って特定の文字列を置換する方法 で紹介させていただいた記事の追記です。

今回は、同じ要素内で複数のテキストを変換したい場合の処理に加え、指定のテキストにタグやクラスを付与して、CSS で(強引に)デザイン変更させる方法も合わせて紹介させていただきます。
続きを読む

[JS]ウィンドウの高さを取得して要素の高さを100%にする方法

jQuery でウィンドウの高さを取得して、特定の要素の高さを常に100%にする方法のご紹介です。
続きを読む

[JS]jQuery でフォームの入力選択情報をリセットするボタンの作り方

テキストフィールドに入力した文字や、プルダウンメニュー(select)で選択した項目などを、ボタン1クリックでリセットして初期状態に戻す方法のご紹介です。

jQuery を使って実装できますので、企業サイトのお問い合わせメールフォームでも使えると思います。
続きを読む