CSSのコンテナクエリを使ってみる
コンテナサイズクエリでの設定を中心に、コンテナクエリの実装を試してみます。...
JavaScriptで入力した文字数をカウントする
フォームの文字数制限があるフィールドでたまに見かける、入力した文字数や残り文字数が表示される処理を実装してみます。...
CSSの:is()と:where()を使ってみる
CSSの:is()と:where()を使ってみて、挙動を比べてみます。...
アクセシビリティを考慮したモーダルを実装する
APGのページを参考に、アクセシビリティを考慮したモーダルの実装を試してみます。...
JavaScriptでフォームの送信を一時停止する
フォームの送信が実行された際、送信前に別の処理を挟んでから送信を実行したいということがあったのですが、VanillaJS...
特定のサイトのCookieやWebStorageを削除する
chromeでの作業中、特定のサイト内で使用しているストレージを削除したいということがあるので、やり方をメモ。...
Movable Typeでphpを使って検索ページを作成する
以前にMovable Typeでphpを使用する記事を投稿しましたが、phpを使って簡単な記事検索の実装を試してみます。...
文字列の両端の空白を取り除く
フォームで入力された値の前後に含まれる空白スペースを削除するという実装がたまにあるので、文字列の両端の空白を取り除く方法...
Movable Typeでphpを使用する
Movable Typeでphpを使用する際、phpファイルを使用できるかを試してみました。...
論理積(&&)と論理和(||)の短絡評価
if文で&&を使った際の挙動で思っていたのと違うということがあったので、調べたことをメモ。...
padStart()で数値の桁数を揃える
以前に桁数を揃える処理を実装しましたが、padStart()メソッドで簡単に実装できそうだったので試してみます。...
Movable Typeでデータ登録後にコンテンツフィールド名を変更する
Movable Typeで構築したサイトのコンテンツフィールド名を変更したいということがあったのですが、既存の登録データ...
フォーム要素のデザイン変更でアクセシビリティに配慮する
ラジオボタンやセレクトボックスなど、フォームのパーツをデザイン変更することがよくありますが、そういった際にアクセシビリテ...
dialog要素を使ってみる
dialog要素を使った実装を試してみます。...
スクリーンリーダーのNVDAを使ってみる
アクセシビリティ対応の検証でスクリーンリーダーのNVDAを使う機会があったので、使用方法についてメモ。 今回使用するのは...
JavaScriptのreplaceAll()を使ってみる
文字列を置換する際、複数箇所マッチした場合でもすべて置換できるreplaceAll()を使ってみます。...
Movable Typeのコンテンツデータの情報でCSVファイルを作成する
Movable Typeの記事の場合はエクスポートする機能が標準で用意されていますが、コンテンツデータの場合はその機能が...
margin-inlineとmargin-blockを使ってみる
margin-inlineとmargin-blockを使ってマージンを設定してみます。...
フォームのマークアップでアクセシビリティを考慮する
フォームのマークアップについて、アクセシビリティを考慮したコードを考えてみます。...
オプショナルチェーン演算子を使ってみる
オプショナルチェーン(optional chaining)演算子を使って、オブジェクトの中を参照する方法を試してみます。...