jQuery

テキストフォーム、テキストエリアフォームなどでHMLで指定したmaxlength（最大文字数）を元に残りの入力可能文字数を取得・表示することが可能なjQueryプラグイン、jquery.maxlength.jsの紹介です。 動作サンプル j ...

文字列の前方一致や後方一致を判別する方法です。 判別にはJavaScriptのstartsWith()を使って前方一致、後方一致にはendsWith()を利用しています。 startsWith()とendsWith()はECMAScript ...

jQueryを使ってdivやpタグなどの要素やテキストにマウスホバーイベントを実装する方法です。 hover()関数でマウスホバーイベントを実装 jQueryのhover()イベントを利用して、指定した要素に対してマウスホバーオン時、マウス ...

jQueryを利用して動的にCSSファイルを読み込んでheadに追加する方法です。 他にも色々と方法はありますが、ぱっと見わかりやすいコードをひとつ紹介しておきます。 jQueryでCSSファイルを読み込んでheadに追加する方法 $.ge ...

jQueryのslice()関数を使って文字列から最初の1文字や最後の1文字を取得する方法です。 See the Pen jQuery get first letter and last letter by yochans (@yochan ...

jQueryのfor文などのループ処理で生成した文字列から末尾のカンマを取り除く方法です jsonデータを生成する時に使う事が多いですね slice()を使って最後の1文字を除去する方法 最後の文字が必ずカンマになるのである場合 処理上、最 ...

jQueryでテキストエリアやテキストフォームの入力を動的に取得・表示する方法です。 テキストボックスの入力を動的に取得・表示する input type="text"のテキストボックスの入力時にvalue値をリアルタイムに取得して表示する動 ...

jQueryを使ってdivやpタグなどの通常の要素やテキストにクリックイベントを実装する方法です。 click()イベント関数を使ってクリックイベントを実装する方法 See the Pen Click event (jQuery) by y ...

jQueryでスライダーフォームの入力時にvalue値を動的に取得する方法です on('change')でvalue値を動的に取得して値を表示する方法 See the Pen クリック要素の直近の子要素のid・classを取得する by y ...

jQueryで要素・親要素からid・class名を取得するパターン集です クリックした要素のidを取得する HTML <div id="id1"></div> jQuery $('div').click(function() { ...

JavaScriptやjQueryのcss()でdisplay:noneで非表示にしている要素を表示に戻した時にレイアウトが崩れてしまう原因と対処法です display:noneから表示に戻すとレイアウトが崩れる原因 display:non ...

CSSで設定した文字色や背景色の値が#000000などのhexカラーコードだったとしてもjQueryのcss()で取得されるカラーコードはrgb(0,0,0)の様にrgbまたはrgbaに変換されたなります。 取得したカラーコードをhex16 ...

jQueryのanimate()を使ってフェードアウトとフェードインを繋げてスムーズに動作させる方法です。 カクツキや位置ずれにならない用にanimate()を設定します。 animate()を使ってフェードアウト・フェードインを実装する方 ...

jQueryのcss()は、疑似要素のCSSプロパティに参照出来きなません。 疑似要素のCSSプロパティを取得するにはJavaScriptのwindow.getComputedStyle()を利用することで実装可能となっています。 wind ...