質問: ### 実現したいこと WEBページを作り、 ブラウザチェックしたのち、 「このWEBサイトは ・OS=○○○○○ ・ブラウザ名=○○○○○ ・ブラウザversion=○○○○○ の環境で正常に動きます。」 という案内をしたい。 ### 発生している問題 同じ「OS・ブラウザ・version」なのに端末で挙動が違うので上記案内ができない。 下記pcAとpcBでjavascriptの挙動が異なる。 ●pcA ・OS=windows10 ・ブラウザ名=chrome ・ブラウザversion=83.0.4103.116(Official Build) ●pcB ・OS=windows10 ・ブラウザ名=chrome ・ブラウザversion=83.0.4103.116(Official Build) ### 問題が発生するページ 下記はgithubで公開されている、スムーススクロールを実装するプラグインの公式デモページです。 https://cferdinandi.github.io/smooth-scroll 「Linear (no other options)」をクリックした後の挙動は、 ・pcA=スルスルとアニメーションしながらスクロールする ・pcB=パッと一瞬でスクロール位置まで移動する です。 ### 試したこと ●1:googleで似たようなケースを調べる ↓ http://blog.surfboard.co.jp/staff/archives/2013/11/chrome.php を発見。ブラウザに対して何個か操作をすることで解決したとのこと。 ↓ しかし 「キャッシュをクリアしてください。ブラウザ設定をリセットしてください。ブラウザを再インストールしてください」等と、 WEBページへの訪問者に操作を依頼することは避けたい。 開発者側で対策をしたい。 ●2:pcBでjavascriptが効いていないかもと思い、javascriptでalertを出す簡素なプログラムを実装したが alertはきちんと出たのでpcBでjavascriptは無効になっていない。 ●3:pcBで https://cferdinandi.github.io/smooth-scroll を開き検証ツールのconsoleタブを見てみたが、エラーは出ていない。 ### 対応策 原因はthink49様のご回答より判明しました。 windows10のシステム>システム情報>システムの詳細設定>パフォーマンス内の「設定」>パフォーマンスオプション の初期状態「コンピューターに応じて最適なものを自動的に選択する」にチェックが入っていることにより、pcBにおいて「Windows内のアニメーションコントロールと要素」にチェックが外れていたことが原因でした。 初期状態「コンピューターに応じて最適なものを自動的に選択する」にチェックが入っている状態で、アニメ実行を制限する「Windows内のアニメーションコントロールと要素」に自動的にチェックが入るかどうかは、コンピューターの何を基準に判断されるのかmicrosoftに問い合わせました。しかし無料問い合わせのサポート外案件とのことで、初期設定の状態でどんな端末環境だとアニメが制限されるのかは分かりませんでした。jQueryでのスムーススクロールであればpcBでも動きましたのでjQueryで対応しようと思います。今後ブラウザチェックでは、「Windows内のアニメーションコントロールと要素」をONした時とOFFにした時両方で動くかを基準に、対応ブラウザを案内しようと思います。
回答: Windows 10のパフォーマンス オプション、視覚効果の違いではないでしょうか。 「デザインを優先する」 or 「パフォーマンスを優先する」で挙動が変わることを確認しました。 「コンピューターに応じて最適なものを自動的に選択する」であると端末により変化するかもしれません。 変更の際はブラウザの再起動が必要です。