CSS CSSでダークモードに即対応。OSの画面設定をウェブでも利用しよう！
海外のサイトとか見てると、自分のiphoneの設定をダークモードにしてる時、勝手に暗いデザインで表示されてるのを見てどうやってやってるのか疑問だった。きっとjsでデバイス情報を取得して、なにかしてるんだろうと思ったけど違った。CSSだけでで...
CSS 
javascript 【jQuery】ローカルストレージへの保存方法と、遷移後に読み込む方法
phpを使わずに、jqueryだけで遷移前の値を保持したい場合、クッキー（cookie）を使うかローカルストレージ（localstrage）を使うか迷う時がある。自分の場合は、クッキーには数キロバイトしか保存できないから、大体ローカルストレ...
javascript 【jQuery】配列・連想配列の数を取得する方法
jQueryで配列の数を取得するには「.length」を使い、連想配列の数を取得するには「Object.keys」と「.length」ます。下のjQueryが利用方法になります。jQuery// 配列の数を取得var demo1 = ;co...
javascript jQueryで1回だけ実行するイベントを設置する方法
jQueryで1回だけ処理をする場合、便利な「one」メソッドというのがある。「one」メソッドとは、メソッド名のままですが「1度だけ」実行する処理のことを言います。処理を繰り返したくない時などに有効です。一度しか押せないボタンの作り方実際...
CSS 修正したCSSが反映されない！？強制的にキャッシュを再読み込みさせる方法
ページデザインが完成してレスポンシブもばっちりと思って、提出すると「変わってないですが。。。」と言われてしまう。キャッシュをクリアして再読み込みすればいいから「shift」を押して更新すれば良いじゃん！と思っちゃうけど、お客さんにひと手間加...
HTML 【HTML】動画（videoタグ）の枠線を消す方法
なぜかPCのchromeとかiPhoneのsafariだと出ちゃう枠線。必要かな？と思うけど、白背景に白い動画とかだと要るのか。。。でもvideoタグに枠線は要らないなぁ。デフォルトで消えてたらいいと思います。自分で使う基本のCSSに、この...
javascript 【jQuery】要素があるかを判定する方法
jQueryで特定要素が有るか調べる方法のご紹介です。jQueryif($("特定要素").length) {// 特定要素が有る時} else {// 特定要素が無い時}解説「$("特定要素").length」で特定要素が1つ以上存在した...
javascript 【jQuery】特定の要素が表示されていたらを判定
jQueryで表示・非表示の判定って結構使います。エラーテキストが表示されてたらとか、特定の画像が表示されてたらとか、友達のLINE見たら自分からの通知が非表示になってたりとか判定するところっていっぱいある。では、jQueryのコードを見て...
CSS 【CSS】テキストを選択した時の背景や文字色を変更する方法
カーソルで文字を選択した時、なにも指定しないと青い背景で白文字になるけど、サイトのカラーに合わないなぁと思ったら変えよう！ページ全体を同じ感じにするときは、CSSで「::selection」の中に選択した時のスタイルを記述します。// サイ...
javascript 【jQuery】パスワードの表示・非表示を切り替える方法
フォームのパスワードを入力する時、自分で打ったパスワードを見たい時ってあるよね。同じパスワードを２回打つフォームもあるし、健忘症な自分は、どんなパスワードを打ったかすぐ忘れちゃうので、表示できる機能があるとありがたいです。ではデモとコードを...
CSS CSSで太字～細字の調整方法
なんとな～くだけど、タイトルは見やすく「太字」。テキストは読みやすく「細字」。みたいにある日本語のウェブサイトの文字ルール。そんなルールも扱えなくちゃ従えないじゃない。基本を押さえるために、学習は大事。文字の太さの変更は「font-weig...
CSS CSSで角丸四角の作り方
ボダンや画像など、やんわりと表現したいときや、流行りのデザインっぽさを取り入れたいときに使うのがCSSのborder-radius。border-radiusには2つの書き方があり「border-radius: 10px;（全部の角を10p...
CSS 【CSS】iPhoneでsubmitボタンのスタイルをリセットする方法
作ったサイトをPCのchromeデベロッパー機能で確認して即、OK！即、提出した後、ウェブ担当者から「送信ボタンがiPhoneで見ると変なんですけど…。」って確認不足で脇汗出ちゃうやつ。iPhoneで見てみると角丸のグラデーションボタンに...
javascript 【jQuery】今日の日付と、今の時間を取得
昔懐かしいウェブサイトには、サイドバーに今の時間とか「〇〇〇人目の訪問者です」とか表示されてましたね。今のサイトでも今日の天気とか取得してたり、今日の日付と時間ってよくみる技術な気がします。そこで、今日は下のdemoに今日の日付と時間をリア...
javascript 【jQuery】HTMLの書き換え方
ボタンを押した時などのユーザーのアクションによってHTMLを書き換える方法のご紹介です。HTML要素内のテキストを書き換える方法テキストだけを書き換える方法です。$(".demo").text("書き換える内容");HTMLタグも書き換える...
