スマホでピンチインした時に、グローバルメニューを画面から切れないようにしたい
kemshim > スマホでピンチインした時に、グローバルメニューを画面から切れないようにしたい @ 2014/5/24 14:14 |
---|
お世話になっております。
現在、bccolorというテンプレートでwebサイトを作っております。 表題では分かりにくいかと思いますので、画像を載せます。 現在作成しているページをスマホで見たときには、以下のように表示されます。 しかし、ピンチインしたときに以下のようにグローバルメニューが画面から切れてしまいます。 これを画面から切れずに表示する方法はあるのでしょうか。 (例えば、ピンチインしてもグローバルメニューだけ拡大できる大きさが決まっているなど) HTML、CSSの知識がまだまだ未熟で分からなかったのですが、そもそも上記の方法は可能なのでしょうか。 Googleなどを調べてみましたが、なかなか解決策が見つからなかったのでご質問させて頂きました。 宜しくお願い致します。 <動作環境> ■ BaserCMSのバージョン:3.0.2 ■ レンタルサーバー名:ロリポップ ■ スマートURLの利用: OFF ■ 設置フォルダ: 分かりません… ■ 利用しているデータベース: MySQL <動作環境> |
Masamichi > Re: スマホでピンチインした時に、グローバルメニューを画面から切れないようにしたい @ 2014/5/25 17:07 |
---|
kemshim さま
こんにちは! 私も同じテーマを使用しており、おそらく?ご希望の仕様に変更しておりますので、 お試し頂ければと思います。。 引用: これを画面から切れずに表示する方法はあるのでしょうか。 >これを画面から切れずに表示する方法 誤解していたら申し訳ないのですが、 下記の方法で可能かと思います。 スタイルシート内(style.css)の下記の部分
赤い部分(fixed)を relative に変更する。 つまり、下記の様に書き換えます。
これで、ご希望の挙動になるかと思います。 (Android,iPhone,iPadMini 等で確認済み) *補足 グローバルナビ(globalnavi.php)を見ると、グローバルナビの中身は、
↑これらの ブロック で囲まれていることが判ります。 ですので、CSS 内の上記の該当部分を見ると、 どの様な指定がされているのかが判ると思います。 position プロパティについては、お調べになってください^^; HTML クイックリファレンスより(position) http://www.htmq.com/style/position.shtml ■ BaserCMS: 3.0.15〜4.1.5 |
kemshim > Re: スマホでピンチインした時に、グローバルメニューを画面から切れないようにしたい @ 2014/5/26 14:05 |
---|
Masamichi 様
ありがとうございます! 早速、修正したら解決致しました! もっと精進します。ありがとうございました。 <動作環境> |