0

私たちのウェブサイトには左側に 200 ピクセルのメニューがあり、非常に便利ですが、iPad のような小さなデバイスではスペースを取りすぎます。そこで、iPad で Web サイトを水平方向に 200px 右に自動的にスクロールするとよいでしょう。

@media (max-width: ????px) { .. }CSS を使用してメニューを非表示/表示し、ボタンを使用して表示できるようにする同様のソリューションを試しましたが、これはそれほどエレガントではありません。jQuery にはもっと簡単な解決策があるのではないでしょうか?

より明確に言うと、メニューにいつでもアクセスできるようにしたいので、使用したい場合は左にスクロールするだけですが、それ以外の場合は画面いっぱいになりません。

助けてくれてありがとう、ジョシュ

4

3 に答える 3

2

話の教訓は、CSS を使用して Web ページを 200 ピクセル以上移動することはできないということです。JavaScript メディア クエリ ソリューションを使用して実行できます。しかし、実際にはメニューを非表示にしようとしているだけで、メニューが表示されている期間があり、その後ページが移動するため、それは非常に無意味です。

そのため、CSS メディア クエリを使用してメニューを非表示にします。

于 2012-10-29T14:09:23.593 に答える
2

デバイスの幅が 768 から 1024px の間の場合、以下は #menu div を非表示にします (私の情報源によると、iPad のサイズ) 

@media only screen 
  and (min-device-width : 768px) 
  and (max-device-width : 1024px) {

  #menu {
    display: none;
  }

}
于 2012-10-29T14:10:52.333 に答える
0

動作するように見える次のjQueryコードを見つけました：

  $(document).ready(function() {
     window.scrollTo(228,0);
  });
于 2012-10-29T15:10:12.307 に答える