JavaScriptKH（炭酸塩硬度）をmg/L（ppm, アメリカ硬度）からドイツ硬度（°dH）に変換するWebツール
数年ぶりにアクアリウムを始めました。pHとKHの値でCO2濃度が計算出来るのですが、購入した試験紙のKHの単位がアメリカ硬度のmg/Lでして……ドイツ度に変換したくて自動変換Webアプリを（雑に）作りました。入力欄には数字を、例えば40mg...
効率化
JavaScript
業務効率化公開しているウェブサイトの本番ファイルを消してしまった……バックアップも取っていない時にまず確認すること
投稿のネタが切れ気味なので、昔役に立ったことは何だったろうかと思い返していたところ、まず思い当たったのがタイトルの通り「Web開発をしている時に本番ファイルを上書きや消去で壊してしまった……しかもバックアップ取ってない……場合に普及させる（...
JavaScriptハマっているこの部分だけお願いしたい……ちょっと見てもらいたい方へのサービスを開始しました
この度、JavaScript, HTML, CSS, SEO（コンテンツ構成案やライティング、キーワード分析、リーチ数検証など）のみとさせていただきますが、以前からちょこちょこ「この部分だけ助けてもらうことってできますか？」とか「これであっ...
JavaScriptソースコード内における「?（はてなマーク）」の意味と使い方【JavaScript】
以前、『JavaScriptにおける「$（ドルマーク）」の意味と使い方』で、ドルマークの利用シーンについてまとめましたが、本ページでは「?」はてなマーク（クエスチョンマーク）についてJavaScript内でどのように使われるのかシーン別でま...
JavaScriptDOM（要素）の変更や更新を検知するベストな方法〜MutationObserver APIの使い方【JavaScriptガイド】
最近、仕事でDOMが変更されたときにコードを発火したい場面が多く、クリック時やajaxで内容の更新などのタイミングでその都度似たようなメソッドを仕込むのが面倒になることがありました。特に大量のiframeを扱う必要があったので、1ヶ所１ヶ所...
JavaScript2024年最新版 ああ、やっぱり。文字コードの世界シェアランキング
ふとShift JISって結構対応しているけど、需要あるのか疑問に感じたのでWebサイトの文字コードの世界シェアについて調べてみました。きっかけはVSCodeでSJISファイルの編集をする機会がちょこちょこあって、文字化けが面倒で、なんかも...
JavaScriptインターバルタイマー Webブラウザ版【PC/スマホ/タブレット対応・3つ利用可・無料】
無料Webブラウザ版インターバルタイマーです。クイック起動ボタンがあり、素早く起動できます。設定の保存も可能です。全画面表示対応なので特にiPadでの利用がおすすめです。
JavaScripthtml2canvasをスマートフォン（iPhone iOS Safari, Android Chromeのレスポンシブページ）に対応させる方法【JavaScript】
先日、『【PNG画像出力&エクセル出力対応】チーム分けWebツール・重複なしで均等に【グループ分けや組み分けを行うランダム生成オススメWebアプリ】』と『【簡易画像キャプチャ機能付き】テキストを比較して差分を表示するdiffツール【Java...
JavaScript【簡易画像キャプチャ機能付き】テキストを比較して差分を表示するdiffツール【JavaScriptでWebツール】
#text-container { display: flex; justify-content: space-between; } #text-container span { background-color: #ccc; } .inp...
業務効率化【色変更・プレビュー機能付き】SVGタグをBase64変換してCSSのbackground-imageプロパティ用に変換するツール【Photoshop,Illustrator】
SVGタグを入力: 変換 CSS background-image: SVGプレビュー: 色を選択: ※fill値が無いなど色変更できない場合もあります※色を選択するとbackground-imageプロパティのコードも変わります #con...
業務効率化チーム分けWebツール～グループ分けや組み分けをランダム生成！
もちろん無料のチーム分けツールです！Webで完結します。使いやすさを追求した便利機能付き！人数カウンターやグループハイライトなど
業務効率化【優柔不断専用】2択、3択…… 瞬時に決めるWebツール【選べない時、決められない時にご利用ください】
2択、3択～お好みに応じて数を指定出来る運命選択ツール。さあ、数字を心に思い浮かべて……念じた数字が出るかは運次第！優柔不断専用です。
業務効率化素敵な男性や女性をサイトにお招き出来るようになりました。本当にありがとうございました ～画像生成AIの使用方法～
今回はとある女性が当サイトへ訪問してくださいました。まだ未成年ぽいのに大人なような……なんか不思議な女性です。 今回は画像生成AIのお話。 少し前から盛大に流行りだした画像生成AIですが、思い立ってやってみることにしました。先ほど登場した読...
JavaScript画面に要素が入ったかを監視したい～Intersection Observer APIの使い方【JavaScript】
以前、IEが消滅してフロントエンドエンジニア的にメリットを強く感じる旨の記事を掲載しました。『IE（InternetExplorer）のサポート終了から生まれるメリット5選！～フロントエンドエンジニアの観点からJavaScriptを考える』...
業界NEWSGoogle Chrome 118に追加されたCSSルール「@scope」の基礎知識と使い方
CSSの新機能として実装された「@scope」ルールについてまとめました。デザイナー、コーダー、フロントエンドエンジニアの方は要チェックです。※Google Chrome 118安定版リリース時の記事です @scopeとは？ @scopeは...