CSS

placeholder(プレースホルダー)の文字色を変える方法

Placeholder(プレースホルダー)の色を変える方法のご紹介です。 IEと古いEDGEに対応しています。 今のままだと文字色がピンクになっちゃうから、サイトに合う色に変えてね! input::placeholder { color: ...
PHP

phpでパラメーターを取得する方法

前回、はjQueryでパラメーターの値を取得したので、今回はphpで同じことをやろうと思います! このブログのURL「」にこんなパラメーターが付いてた時のphpでの取得方法。 // 例として、このURL↓からパラメーターを取得します。 //...
javascript

jQueryでURLのパラメーターと値を取得する方法

パラメーターを使って表示を切り分ける方法って、よくphpで利用するよね。 それを利用して、URLに特定のパラメーターが付いてる時に、処理する方法をご紹介します。 例えばこんなURL「」の時、きっとこのサイトはコロナでの大変なことをまとめてい...
javascript

jQueryでクリップボードにコピーする方法|コピペ

テキストをコピーする時、ユーザーに「Ctrl + c」とか「⌘ + c」とか求めても良いけど「コピーする」ボタンがあったらちょー親切。
javascript

jQueryでホバー(hover)処理する方法

jQueryでhoverイベントを取得し、カーソルが要素に乗った時と外れた時のアクションを指定する方法のご紹介です。 DEMO 好きな色のパネルにカーソルを当ててね! こんなデモのような処理も簡単に出来るjQueryを使ったホバー処理。 C...
CSS

IEでセレクトボックスの矢印を消す方法

CSSでセレクトボックスのスタイルを作っていると、chromeやfirefox、EDGEは大丈夫なんだけれど 「IE」がやっぱりダメなんだよなぁ。 サポートは終わったけど、やっぱり対応しておかないとね。 全部同じ条件にした方がデザインしやす...
javascript

jQueryで画像を先読みする方法(プリロード)

jQueryで画像を先読みするしたい時、例えば他のページのトップ画像とかを先読みさせておけば 別ページへ遷移した時にスルッと表示できる。まるで遷移してないみたいに振舞えるんだ。 では、jsファイルの「function」のすぐ下に先読み(プリ...
javascript

jQueryで追加した要素にクリックイベントを設定する方法

jQueryで後から追加した要素は、普通にクリックイベントを設定しても動かない。 そんな時の解決方法のご紹介です。 後から追加した要素にクリックイベントを発火させる方法 例として下のHTMLをjQueryで追加します。 jQueryで追加し...
javascript

jQueryで親・先祖要素の取得方法

jQueryで親・先祖要素の取得方法のご紹介です。 例えばリストの中の「a」や「p」タグをクリックした時に 親要素のリストに何かアクションが必要な時などに便利な方法です! 親要素の取得 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を変更したらいいかわからない時などにご覧いただければ嬉しいです。
広告