javascript jQueryで追加した要素にクリックイベントを設定する方法
jQueryで後から追加した要素は、普通にクリックイベントを設定しても動かない。そんな時の解決方法のご紹介です。後から追加した要素にクリックイベントを発火させる方法例として下のHTMLをjQueryで追加します。jQueryで追加したHTM...
javascript 
javascript jQueryで親・先祖要素の取得方法
jQueryで親・先祖要素の取得方法のご紹介です。例えばリストの中の「a」や「ｐ」タグをクリックした時に親要素のリストに何かアクションが必要な時などに便利な方法です！親要素の取得HTMLの「a」タグの親要素を取得する方法を例にして、親要素の...
CSS ホバーした時にCSSだけで出来る様々な画像切り替え方法
CSSだけでホバーした時に、様々な画像切り替え方法のご紹介。色んなパターンの画像切り替えサンプルを用意しますので、まずは基本のHTMLを。このHTMLを書いて2枚画像を用意して、目的のCSSをコピペすれば同じ動きになります。沢山サンプルがあ...
javascript jQueryでボタン連打を防止する方法
フォームやチュートリアルの「選択ボタン」や「進むボタン」、「戻るボタン」を作る時、連打防止がついてるとめっちゃ親切。ボタン連打防止があるサイトを見ると丁寧に作ってあるなぁと感心しちゃいます。今回は、そんな関心出来るサイトを作るために付けたい...
javascript jQueryでinput、textareaの入力を検知する方法
jQueryでフォームのインプット、テキストエリアの入力を検知する方法のご紹介です。入力検知にはいくつかあるので、DEMOで動きを確認しながらどれが最適か選択してください。DEMO 「keypress」を使った入力検知｜キーを押した時に検知...
javascript jQueryで特定文字列より後ろを削除する方法
jQueryで特定の文字列以降を削除する方法のご紹介です。特定の文字列以降を削除する時に自分の中で一番よく使う方法は「split()」を使ったもの。「split()」は、指定文字列（「,」や「/」など）ごとに分割して配列に格納してくれる便利...
HTML テキストエリア（textarea）を変更不可にする方法｜HTML
フォームのテキストエリア（textarea）を変更できなくする方法のご紹介です。テキストエリア（textarea）を変更できなくする場合は「readonly属性」を使います。DEMO このテキストは消せません（意味はないですが文字をいろんな...
javascript jQueryでCSSを動的に変更・追加・削除する方法
jQueryでCSSを変更する方法のご紹介です。どうやってCSSを変更したらいいかわからない時などにご覧いただければ嬉しいです。
CSS width 100%なのに、なぜはみ出た！？を解決する方法｜CSS
幅を指定したのにはみ出ちゃう時「width」を98%とかに指定して何とかはみ出さないようにと考えちゃうけど、それは間違っている。ちゃんと「width:100%」でpaddingやborderを含んでいてもはみ出さない方法をご紹介します。
javascript jQueryで「○○○」が含まれていたら｜.indexOf()
jQueryで特定文字が含まれる時って色々方法がある。今回は「.indexOf()」を使った切り分けのご紹介です。
javascript jQueryで現在のURLを取得
jQueryで今のページのURLを取得する方法は、「$(location).attr('href');」です！このページに動作確認のDEMOがあるので、気になる方はページを見に来てくださいね。
javascript jQueryで、読み込みとリサイズ処理を一緒にと、ロードとリサイズ処理を一緒に書く方法
jQueryでロードとリサイズを一緒に書く方法のご紹介です。$(function() { $(window).on("load resize", function() { // ロードとリサイズ時の処理 });});次に読み込み時とリサイズ...
HTML HTMLでリンク先を別タブ・別ウィンドウで表示する方法
リンクを押したら別タブ・別ウィンドウで表示する方法のご紹介。まずは別タブでの表示方法から。aタグに「target="_blank"」を書くことで別タブで表示可能です。別タブでリンクを開く方法<a href="" target="_blank...
javascript jQueryで端末判定＆Androidバージョン判定
jQueryでの端末を判定する方法のご紹介です。まずは、PC、スマホ、タブレットを判定するコードを紹介します。DEMOあなたの端末はです！// ユーザーの端末情報を「use」に格納します。var use = navigator.userAg...
CSS CSSのposition:stickyを使ったスクロール特定範囲の固定方法
サイドバーやコンテンツで一定範囲、スクロールに追随する要素の作り方のご紹介です。まずは、デモで動きを確認してみよう。DEMO12345678910HTML<div class="demo1"> <div class="demo1_conte...
