モダンCSSの新機能のブラウザ対応がこれで簡単になる！ Modernizrに代わる新しいスクリプト -SupportsCSS
2023年もCSSの新しい機能が続々とリリースされ、進化が早いですね。魅力的な新機能を使用するときに気になるのが、ブラウザのサポートです。 ブラウザがその機能をサポートしているかチェックし、判別するクラスを付与してくれるといえば、Modernizrですが、その更新はストップしています。 そんなModernizrに代わる、モダンCSSに対応したスクリプト、SupportsCSSを紹介します。@containerも@layerも:has()もsubgridもcolor-mix()にも対応しています。 SupportsCSS SupportsCSS -GitHub SupportsCSSはModernizrにインスパイアされたスクリプトで、モダンCSSに使用されるセレクタ・機能・@ルールなどのサポートをライブ検出できます。 CSSの@supportsもサポートしている機能を検出できますが、Sup
簡単な設定で使える軽量でモダンなキーバインドライブラリ・「tinykeys」
tinykeysは簡単な設定で使える軽量でモダンなキーバインドJavaScriptライブラリです。 以前にもwhenipressというライブラリをご紹介しましたがtinykeysの方が若干使いやすい印象でした。 上にサンプルを用意しましたが、反応が無い場合はCodepen内にフォーカスしてからお試しください。 使い方も非常にシンプルです。 <script src="https://cdn.jsdelivr.net/npm/tinykeys/dist/tinykeys.umd.js"></script>tinykeysを読み込みます。 tinykeys(window, { "Shift+D": () => { alert("ShiftとDが押されました！"); }, "y e s": () => { alert("YES！はいそうです！"); } });キーの設定とキーが押されたときの内容を
Hyperform - Webフォームの入力チェックライブラリ
MOONGIFTはオープンソース・ソフトウェアを紹介するブログです。2021年07月16日で更新停止しました Webフォームにおける入力検証の仕組みは大事です。一度サーバに送信してからエラーを返す方式はユーザのストレスも大きくお勧めしません。サーバ側での入力チェックは必要ですが、ユーザビリティのためにWebブラウザ側でも入力チェックをしましょう。 今回はそんな入力チェックを提供するJavaScriptライブラリ、Hyperformを紹介します。 Hyperformの使い方 利用例です。エラーメッセージをテキストボックスの下に表示します。 パスワードのように二つの入力欄に応じたケースもサポートしています。 チェックボックスが有効な場合だけ入力チェックが行われます。 URLやメールアドレス、時間などのフォーマットに合わせた入力チェックもできます。 エラーメッセージはフォームの上に出すこともでき
フォームバリデーションを楽にするライブラリを車輪の再発明してみた | 株式会社LIG(リグ)｜DX支援・システム開発・Web制作
こんにちは、フロントエンドエンジニアのいなばです。 去年はひたすらAngularJSをやっていましたが、今年はAngular2への乗り換えのためにいろいろと苦労しています。Angular2づくしの1年になりそうです。そして、去年の暮れからbabel教からTypeScript教へと改宗ました。 まだジェネリクスなどをあまり理解していない部分もありますが、TypeScriptの練習がてら、よくあるお問い合わせフォームのバリデーションライブラリを実装してみました。 リポジトリはこちら。 https://github.com/i78s/ValidateJS 対応ブラウザはモダンブラウザ（IEは10以上）、モバイルも対応しているつもりです。（なにか不具合があれば、issueを立ててもらえるとありがたいです） jQueryのバリデーションプラグインなどではデザインによっては仕様が合わず、使いずらいこと
is.js - micro check library
Checks if the given value type is arguments. var getArguments = function() { return arguments; }; var arguments = getArguments(); is.arguments(arguments); => true is.not.arguments({foo: 'bar'}); => true is.all.arguments(arguments, 'bar'); => false is.any.arguments(['foo'], arguments); => true // 'all' and 'any' interfaces can also take array parameter is.all.arguments([arguments, 'foo', 'bar']); =
スマホ等のモバイル判定が簡単に行えるライブラリ「MobileESP」:phpspot開発日誌
The MobileESP Project: Easily detect mobile web site visitors About MobileESP スマホ等のモバイル判定が簡単に行えるライブラリ「MobileESP」 Android、iPhone、Blackberry等、大量のモバイルデバイスが存在しますが、そうした物の判定を行ってくれる各種言語用のライブラリ群です。 docomo, kddi, vodafoneなんていう記述もあったりしてガラケーも対応してるっぽいです。 対応言語は、PHP, Java, APS.NET (C#), Ruby ,さらにはJavaScript版もあるようです iPhone端末かどうかを調べるには次のようなコードを書きます。 $uagent_obj = new uagent_info(); if ($uagent_obj->isTierIphone =
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
IDEA * IDEA
