Blog
Web制作開発に役立ちそうなTipsや、インターネットに思うことなどを不定期で書いています。
【JS】IEではエラーとなる記述例
スマホでの表示に対して画面の高さ100%を実現するために、よく下記のJavaScriptコードが使われていると思います。
1 | document.documentElement.style.setProperty('--vh', `${vh}px`); |
【参考】
[CSS]スマホで要素を高さいっぱいに表示したいのに、期待通りに表示されない時の解決方法 / coliss様
ところが、この記述はIE11でもエラーとなり上記の記述が含まれるすべてのJavascriptは動作しなくなってしまいます。
サポートが終了したとはいえ、まだまだIEもご健在。これでは困りますね。
IEがエラーとしてしまうのはこの箇所です。
1 | `${vh}px` |
そこで、該当の行を以下のように書き換えてみてはどうでしょうか。
1 | document.documentElement.style.setProperty('--vh', vh + 'px'); |
いずれ不要になる対応ではありますが、現状はまだ後者で統一しておいたほうが無難かもしれませんね。
お気軽にお問い合わせください。
お見積りは無料です。