JS フルスクリーンの開始、解除 ページでブラウザのフルスクリーンモードを実装し、解除するサンプルです。 動画の再生など大画面で見てほしいコンテンツは、全画面表示をしてほしいので、このサンプルはその制御をする時に使います。 ボタンを押して、フルスクリーン... 2022-06-19 22:11:22
CSS ダークモードをCSSで出し分け OSでダークモードの時、CSSで検知し、スタイルを変更するサンプルです。 OSで暗いところ用のダークなモードの切り替えは、だいぶ浸透してきました。 サイト側でも個別でダークモードを用意していたサイトもあるかもしれません。... 2021-06-03 00:38:01
JS カメラの映像を表示させる カメラの映像をブラウザに表示させるサンプルです。 このサンプルではパソコンやスマホの画面側についているカメラの映像を取得して、ブラウザに表示します。 以下のボタンを押すとブラウザがカメラにアクセスし... 2020-02-11 22:38:25
JS ブラウザでQRコード読み込み ブラウザのページのボタンからカメラを起動し、ページに戻ってQRコードから取得した値を表示するサンプルです。 近年QRコードはだいぶ広まってきました。 URLを筆頭に長い文字や数字を打ち込むのが面倒なときの入力補助ツールになっています。 そこで今回はブラウザか... 2020-02-04 21:28:21
jQuery スクロールでURLを書き換える URLを書き換えるJSを、スクロールで移動したコンテンツの位置をトリガーに発動させるサンプルです。 記事などのコンテンツで、スクロールして下まで読み切ると、次の記事が表示されるサイトがあります。 今時は通信速度が速く、ついついたくさん読ませるための... 2019-07-29 20:32:02
PWA ホーム画面に追加するボタン プログレッシブウェブアプリケーションが徐々にブラウザでサポートされ始めました。その機能を使ってアプリのようにホーム画面に追加することができるようになったので、実装してみました。 2018年2月頃からGoogle Chromeのアップデートの中でウェブサイトがアプリライクな機能を実装できるようになるPWAといういろんな機能が徐々にサポートされてきま... 2019-08-03 23:12:02
jQuery キーを押されたら実行 キーボードのボタンを押されたときに何かを実行するときのサンプルです。 例えば「a」のボタンが押されたときに、何かイベントを発動させたいときjQueryで発動させることができます。 まずは、キーを押された時に取得できる値を確認... 2019-08-03 22:05:56
HTML5 ダウンロードボタン HTML5であればaタグに、download属性を書くだけでダウンロードボタンが作れます。 下記の画像をダウンロードしたいとき、右クリックで保存するのが一般的ですが、サイトの都合によってボタンを押したときにダウンロードが始まるようにしたい場合... 2019-07-28 04:49:43
JS バイブレーション 現在はまだAndroidのみですが、バイブレーションをJSで発火させることができます。 スマホには大抵バイブレーションの機能がついています。 OSがAndroidの場合、以下のJavaScriptで簡単に発動できます。 $(document).ready(function() {... 2019-07-28 17:08:52
JS URLクエリ取得 URLから情報を取得するときの例です。 URLについているパラメータ情報だけでなく、JavaScriptでURLからいろいろな情報を得ることができます。 [[location.... 2019-08-03 12:22:10