javascript jQueryでメディアクエリの指定方法｜画面幅で判定
jQueryで画面幅からメディアクエリを行う方法のご紹介です。 画面幅を取得し、横幅によって表示を切り替えるデモとjQueryです。 画面を広げたり縮めたりしてみてください！ DEMO これは、表示。 width：px jQuery // ...
javascriptについての記事一覧
javascript 
javascript jQueryでブラウザの横幅・高さを取得する方法｜初回読み込み時、リサイズ時に取得
まずは、ウィンドウの横幅と高さを取得します。 DEMO 横幅：px 高さ：px // ウィンドウの横幅 var width = $(window).width(); // ウィンドウの高さ var height = $(window).he...
javascript jQueryのセレクタ指定方法まとめ｜よく使う指定方法から狂気の指定方法まで
jQueryでセレクタ（HTML要素）を指定する方法ですが、ずっとjQueryを使っていても指定方法が難しくって 結局いつもクラスを足しちゃったりしているので「覚えよう！」の意味を込めてまとめたいと思います。 ID、クラスの指定方法 $("...
javascript jQueryのeachで繰り返し処理を実行する方法｜HTML要素と配列で処理を繰り返す
HTMLの数ぶん要素を取得したいときや、配列に格納してある要素ぶん、処理を繰り返したいとき使うのがjQueryの「each()」。 「each()」を使った処理の繰り返し方法をデモを使いながら見ていきましょう。 HTML上の要素ぶん繰り返す...
javascript 【jQuery】文字が1文字ずつ出るアニメーション作成方法
タイトルとか、サイトのキャッチをアニメーションで出す時、 一文字ずつフワッフワッと出てくると「おっ！」ってなるじゃない。 そんな「おっ！」を聞きたくて一文字ずつ出るテキストを作成してみたいと思います。 まずはdemoでどんな感じのアニメか確...
javascript jQueryでURLのパラメーターと値を取得する方法
パラメーターを使って表示を切り分ける方法って、よくphpで利用するよね。 それを利用して、URLに特定のパラメーターが付いてる時に、処理する方法をご紹介します。 例えばこんなURL「」の時、きっとこのサイトはコロナでの大変なことをまとめてい...
javascript jQueryでクリップボードにコピーする方法｜コピペ
テキストをコピーする時、ユーザーに「Ctrl + c」とか「⌘ + c」とか求めても良いけど「コピーする」ボタンがあったらちょー親切。
javascript jQueryでホバー(hover)処理する方法
jQueryでhoverイベントを取得し、カーソルが要素に乗った時と外れた時のアクションを指定する方法のご紹介です。 DEMO 好きな色のパネルにカーソルを当ててね！ こんなデモのような処理も簡単に出来るjQueryを使ったホバー処理。 C...
javascript jQueryで画像を先読みする方法（プリロード）
jQueryで画像を先読みするしたい時、例えば他のページのトップ画像とかを先読みさせておけば 別ページへ遷移した時にスルッと表示できる。まるで遷移してないみたいに振舞えるんだ。 では、ｊｓファイルの「function」のすぐ下に先読み（プリ...
javascript jQueryで追加した要素にクリックイベントを設定する方法
jQueryで後から追加した要素は、普通にクリックイベントを設定しても動かない。 そんな時の解決方法のご紹介です。 後から追加した要素にクリックイベントを発火させる方法 例として下のHTMLをjQueryで追加します。 jQueryで追加し...
javascript jQueryで親・先祖要素の取得方法
jQueryで親・先祖要素の取得方法のご紹介です。 例えばリストの中の「a」や「ｐ」タグをクリックした時に 親要素のリストに何かアクションが必要な時などに便利な方法です！ 親要素の取得 HTMLの「a」タグの親要素を取得する方法を例にして、...
javascript jQueryでボタン連打を防止する方法
フォームやチュートリアルの「選択ボタン」や「進むボタン」、「戻るボタン」を作る時、 連打防止がついてるとめっちゃ親切。 ボタン連打防止があるサイトを見ると丁寧に作ってあるなぁと感心しちゃいます。 今回は、そんな関心出来るサイトを作るために付...
javascript jQueryでinput、textareaの入力を検知する方法
jQueryでフォームのインプット、テキストエリアの入力を検知する方法のご紹介です。 入力検知にはいくつかあるので、DEMOで動きを確認しながらどれが最適か選択してください。 DEMO 「keypress」を使った入力検知｜キーを押した時に...
javascript jQueryで特定文字列より後ろを削除する方法
jQueryで特定の文字列以降を削除する方法のご紹介です。 特定の文字列以降を削除する時に自分の中で一番よく使う方法は「split()」を使ったもの。 「split()」は、指定文字列（「,」や「/」など）ごとに分割して配列に格納してくれる...
javascript jQueryでCSSを動的に変更・追加・削除する方法
jQueryでCSSを変更する方法のご紹介です。どうやってCSSを変更したらいいかわからない時などにご覧いただければ嬉しいです。
