SimplicityをiPhoneで閲覧すると下部メニューが浮いてしまってる件で、わいひらさんから回答をいただきました。

楽しんでいただけましたか?シェアしていただけると励みになります。

おはようございます。
桜も散るころなのに、寒の戻りということで、超寒いです。私はミノムシになりたい。どうもGonta(@g_siitter)です。

昨年の秋ごろから、僕のWordPressのテーマは『Simplicity』を使わせてもらってます。
作者は、わいひらさん(@MrYhira)です。

初心者なりに色々なテーマを使ってきましたが、特にこの『Simplicity』は、進化のスピードがハンパないです。

スポンサーリンク

新しいメニュー表示のアップデート

先日あるアップデートで、スマホ表示の際にスライドインメニューの実装がありました。
おおっ!なんかすごい!
右から左からシュッ、シュッと出てきてなんか、近未来的な感じがする!(笑)
『Simplicity』のこういう、シンプルなのに高機能なところが好きです。

なんかおかしい?

僕はさっそくバージョンアップをし、カスタマイズの項目からスライドインメニューを選択!
手持ちのiPhone5で確認してみると。

あらっ。
なんかボタンたちが浮いてますね。(下スクロール時&静止時)
th_IMG_2742
上スクロールすると、ボタンの下からブラウザのメニューが顔を出します。
th_IMG_2743
僕の使ってるブラウザはSafariですので、もしかすると、
iPhone系のモバイル端末(iPod含む)はこういう表示になってるかもしれません。
ちなみに4年くらい前に購入したAndroid端末で表示してみると、ボタンたちはきちんと最下部にきていて、非常にスッキリと表示されていました。
またiPhoneでも、Chromeブラウザでは正常に表示されていました。(でもChromeって、上にボタンとかあるから使いづらいんだよね)

お返事をいただきました

この件について、作者であるわいひらさんに、サポートフォーラムにて質問させていただき、お返事をいただきました。

多分、画面の高さを取得するときに、「ブラウザの操作ボタン等」の分を差し引いて表示されるので、そのように表示されるのではないかと思います。

jQueryで端末画面の高さを取得したら、ブラウザがその高さを返しているということなので、それはどうしようもないかもしれません。
もし直せるのだとしても、動作確認用のiPhoneを持っていないので、今はどうしようもできないです。

とのことでした。

僕の理解としては、プログラム的にはボタンは最下部に表示するように指定しているのに、Safariに関しては、それがSafari自体のメニューバーが表示される高さを除く最下部になってしまうということなんだと思います。
だからブラウザメニューの高さ分、浮いて表示されるんですね…。
(説明下手でごめんなさいね…)

ですので、WordPressで『Simplicity』を使っていて、モバイルメニュータイプを「スライドイン」にしてる方は、このように表示されるということを一応、気に留めておくといいかと思います。
また、現段階では、修正方法を見出だすことが難しいそうです。
まぁスライドインメニューでなくても、デフォルト表示もモーダル表示もありますしね。

あっ、ちなみに解決方法がお分かりの方がいらっしゃいましたら、ご教示いただけると幸いです。

わいひらさん(@MrYhira)には、ご多忙のなか親切丁寧に答えていただき、感謝しつつ、今後も『Simplicity』を愛用させていただきます。

Simplicity | SEO最適化済みのシンプルな無料Wordpressテーマ

スポンサーリンク

楽しんでいただけましたか?シェアしていただけると励みになります。

フォローしていただけると嬉しいです!