Javascriptでスマホのスクリーンキーボードの高さとかを検出する話 | かぁくん本紀
公開日時: 2023-01-02 01:16:54更新日時: 2023-03-22 02:29:30事の発端 「アプリが不便になった」知り合いから突然そんな一報があったのは大晦日の夜。 当該のwebアプリはたしかに当方が自作したものでしたが、2ヶ月以上更新していなかったはずがいきなり不具合の報告とあって、まさに寝耳に水でした。 調べてみると、どうやらChromeがバージョン108にアップデートされた辺りでAndroid版でのスクリーンキーボード周りの仕様に以下のような変更があった模様。 これまでのChrome ちなみに、Safariなどは以前から後者の仕様だったようですが、当方のwebアプリはAndroid向けだったためこのような仕様は考慮しておらず…… 結果的に、正月早々からこの仕様変更への対処に追われることになってしまいました(まあ、これでiOS環境でも利便性が向上するというメリットは
スクロールジャンクを防ぐ “Passive Event Listener”とは | webico blog
ontouchstartによるスマホでのhoverアクションの有効化 これまでスマホではhoverアクションを使わない方向でコーディングしていたので、まずどう書けばhoverを表現できるのかを検索しました。 するとすぐ何件かヒット。 どうやらHTMLに「ontouchstart」のイベントハンドラを書くと、その要素に対してCSSで記述していたhoverアクションが効くとのことでした。 イベントハンドラはその要素を内包する要素に記述しても問題ないため、例えば全てのhoverを有効にしたいなら<body ontouchstart=””> でOKなようです。 実際に試してみたところ、本当にこれだけでスマホでhoverアクションが表現できました。 しかしながら、開発者ツールのコンソールに次のような警告がでるようになりました。 スクロールジャンクの警告メッセージ 全文はこちら。 [Violation
Visual Studio CodeでのJavaScriptのデバッグ方法 - ICS MEDIA
マイクロソフトが無償で提供しているコードエディター「Visual Studio Code（略称：VS Code）」はGoogle ChromeやMicrosoft Edgeのデバッグ機能と連携できます。VS Code上でブレークポイントを設定してコールスタックを確認したり、ステップ実行や変数のウォッチなどを行えます。複雑なJavaScript開発を行っている方は、デバッグ機能を使うことで、効率のよい開発体験を得られるでしょう。 本記事ではデバッグ機能を使うためのVS Codeの導入方法について説明します。 導入手順と前提 VS Codeにはデフォルトでデバッグ機能が搭載されています。 ※2021年8月以前のVS Codeでは拡張機能「Debugger for Chrome」の導入が別途必要でしたが、今のVS Codeでは拡張機能をインストールする必要はありません。 本記事では、ウェブページ
ChromeのNET::ERR_CERT_INVALIDを強制スキップする方法 - ゆうきのせかい
MacのMAMPで作ったローカルのテスト環境をHTTPS化したら、Chromeで「この接続ではプライバシーが保護されません NET::ERR_CERT_INVALID」と表示されてしまった。 困った事に、「詳細設定」を押しても「危険性を理解した上でアクセスする」のオプションがなく、どう頑張ってもテストサイトの画面が見れない...。 こんな時に強制的にスキップしてサイトを表示する方法をメモしておきます。 ChromeのNET::ERR_CERT_INVALIDをスキップする隠しコマンドChromeブラウザのエラーが表示されている画面で、 半角英数モードでthisisunsafeとキーボード入力するだけです。 「え、そんな隠しコマンドあったん？」とビックリしたのですが、騙されたと思って試してみてください。 入力が完了すると、直後に画面が自動的にリロードされ無事にサイトが表示されるようになりまし
Chromeブラウザにメモリ使用量を削減し消費電力を下げるモード実装へ - iPhone Mania
数あるWebブラウザのなかで最もシェアが高いGoogleのChromeブラウザですが、メモリ使用量が多すぎるという批判もあります。 そんな声に応える形で、Chromeブラウザにメモリ使用量を節約しノートPCのバッテリー駆動時間を延ばすモードが実装されることがわかりました。 非アクティブなタブのメモリを解放 このモードは、非アクティブ状態のタブのメモリを解放することでメモリ使用量や消費電力を削減します。 メモリ使用量が削減されたタブのコンテンツは、再びそのタブがアクティブになったときに再読込されるとのことです。 このモードは高効率モード（high efficiency mode）と呼ばれており、非アクティブ状態のタブのメモリを解放する周期を5秒、30秒、2分、1時間など、好みにあわせて指定することができます。 表示されていないタブもバックグラウンド動作によりCPUパワーを消費するため、できる
Chromeで突然画面が真っ暗になる（黒くなる）不具合を解消する方法
HAGANEYA（@imech_jp）です。 いつものように Chrome を使っていたら、突然画面が真っ暗になりました。 とは言っても、ずっと真っ暗なわけではありません。Chrome を再起動すると何事もなかったかのように閲覧が可能です。 そして、しばらくすると再び画面が真っ暗になります。この繰り返しです。 原因は不明ですが、直近で "プリンタ用のドライバ" はインストールしました。でも、これが原因ではないような気も・・・ その後、色々と調べてみたところ「おそらく "ハードウェアアクセラレーション" 周りが絡んでるのではないか？」という仮説に辿り着きました。 ハードウェアアクセラレーションとは、簡単に言うと "CPUの負荷を軽くしてくれる機能" です。グラフィックカード（ビデオカード）やサウンドカードなどに、CPUだけで行っていた処理を任せることによって、ソフトウェアの動作が軽快になる、
Google Chromeのメモリ使用量を50%以上削減する魔法のコマンド
@おったんです。今回は、Google Chromeを通常通り使用しながら、メモリ使用量を圧倒的に削減するための魔法のコマンドをご紹介します。なお、今回は魔法のコマンドを使用する前と後で、どれくらいメモリ使用量が増減するか実験を行っています。今回の実験のポイントは以下の通りです。 任意のWebページを10個開いてメモリ使用量を比較する 実験に使用するWebページは無作為抽出とする 無作為抽出とはいえ、人の手によるものですから、完全なランダムではありません。実験の方法によっては多少の誤差があることをお見知り置きください。 魔法のコマンド使用前のアクティビティモニター Google Chromeは、タブ数や拡張機能が増加すればするほど「Google Chrome Helper」という、Google Chrome本体から生成された子プロセスでいっぱいになります。同プロセスの1つ1つのメモリ使用量は
【テックコラム】Chromeブラウザによる User Agent の削減と User-Agent Client Hints への移行 | DataCurrent
2021.10.15 コラム Privacy SandboxUser Agentデータプライバシーテックコラム 【テックコラム】Chromeブラウザによる User Agent の削減と User-Agent Client Hints への移行 ● はじめに こんにちは、DataCurrent の不破です。 User Agent と言えば、ブラウザからサーバーへのリクエストヘッダや JavaScript API を通じて取得できるユーザーのOS・ブラウザ情報として、ウェブ開発者やデータアナリストの方々には馴染みの深いワードかと思います。 私も以前広告配信事業に携わっていた際には、当時業界で流行っていたリッチメディア広告（インタースティシャル広告やフローティング広告など、懐かしいと思う方もいらっしゃるかと思います・・！）を広告配信サーバーに設定し各ブラウザで動作検証をすると、特定のブラウザバ
Microsoft Edgeでしぃペインター｜さとぴあ
Chrome拡張機能CheerpJ Applet Runnerをインストールすれば、お絵かき掲示板のJavaアプレットをJavaプラグインなしで起動する事ができます。 また、お絵かき掲示板交流サイトではCheerpJをインストールしていなくてもしぃペインターを使う事ができます。CheerpJを起動するためのJavascriptを掲示板に組み込んでいるからです。 Chromeの拡張機能をインストールする必要がないのでFirefoxでもしぃペインターを使う事ができます。 Edgeでは動かない？Chromeの拡張機能なのにFirefoxでも動くのならWindows10に最初から入っているEdgeでも動くのでは？と思いましたが動きませんでした。 ChromiumベースのEdgeは2020年1月15日リリース Chromiumベースの新しいEdgeはどうでしょうか？Chromeと同じオープンソースの
起動オプション - Google Chrome まとめWiki
起動オプションの設定方法 Windows版の場合 Google Chromeのショートカットを新規作成 作成したショートカットを右クリック、プロパティを選択 ”リンク先”へ起動オプションを追加 例 XP "C:\Documents and Settings\＜ユーザー名＞\LocalSettings\ApplicationData\Google\Chrome\Application\chrome.exe" --disable-javascript --disable-java --disable-plugins Vista "C:\Users\＜ユーザー名＞\AppData\Local\Google\Chrome\Application\chrome.exe" --disable-javascript --disable-java --disable-plugins 半角スペースを空けてオ
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
https://bugs.chromium.org/p/chromium/issues/detail?id=1208612&q=context_lost&can=2
Chromium
主要ブラウザのバージョンとリリース予定 - Qiita
Chrome Platform Status
Google Chromeでハードウェアアクセラレーションを無効・有効にする設定