デザイナーのオッコです。
レスポンシブ対応のため、iPad proでテストを行ったところ、fullCalendarが出るはずの部分がまっさらでカレンダーが表示されていませんでした。iphoneも同様。
jsは以下の書き方をしていました。
<script>
window.onload = (e)=>{
//fullCalendarの処理
}</script>ちなみにChromeのエミュレータでは問題なく動作します。
最初はfullCalendarが関係していると思い、オプションなどを色々調べていたのですが、どうも違うということで、js内にalertを書きまくって検証してみました。
windowsで動くjsがiOS端末で動いていない
Chromeで期待通り出たアラートが、iOSでは出ませんでした。
どうやらiOSではwindow.onloadの中身だけ処理をすっ飛ばしているようです。
<script>
alert("ここは出る");
window.onload = (e)=>{
alert("ここは出ない");
//fullCalendarの処理
}</script>iOS＋safariでwindow.onloadが動かない問題について
↑こちらの記事をヒントに以下のように書き換えました。
<script>
document.addEventListener('DOMContentLoaded', (e)=> {
//fullCalendarの処理
});</script>これでiPad/iPhoneでも問題なくカレンダーが表示されました。
リンクにはsafari限定と書かれていますが、私の場合iPadのChromeでも表示されなかったため、もしかしたら原因は以下だったかもしれません。
いずれにせよ、fullCalendarは悪くなかったです。疑ってすみませんでした。
関連記事紹介
システム開発はアピステクノロジーへ
アピステクノロジーでは、システム開発をはじめ、システムパッケージの販売にも力を入れています。
「IT TOOL」をご存じですか？
既に標準の機能が実装されているシステムパッケージを、貴社用にデザインカスタマイズし提供します。
さらに、IT導入補助金の利用で価格を大きく抑えることも可能です。
実績多数、低価格で本格的なサイトができると好評いただいております。
詳しくは弊社HPをご覧ください。
アピステクノロジーの実績紹介はこちら
ITツール紹介ページはこちら
