javascript - Android、iPhone、iPadで動作するウェブサイトのモバイルバージョンを作成するにはどうすればよいですか?

Question

モバイル版のサイトを複製したい。サイトには、スライダー、単純なヘッダー、フッター、およびドロップダウンがあります。

モバイル用に正確なものを作成できますか (私の場合、jQuery で作成されたスライダーとドロップダウンについて話しています)。

私が望んでいるのは、通常のサイトと同じ感覚をモバイルでも実現することです。ビデオの例で見たように、ipad、iphone の場合、メニューをクリックするとページが右にスライドし、何かが新しいページとして表示されます。私はこれをしたくありません。

モバイル版で既存のテーマと配色を選択したい。

どのように私はそれを行うことができます。

score 4 · Accepted Answer

このために、レスポンシブ Web デザインと呼ばれるものがあります :)

ここで見ることができます：

score 2 · Accepted Answer

このトピックは、単純に数行のコードを追加するよりもはるかに複雑ですが、私が提供できるものは次のとおりです。

モバイルとデスクトップを別々にしたい場合（私は反対することをお勧めします）、デバイスのスニッフィングを行う必要があります。最も簡単な方法は、おそらく画面サイズを確認し、320px 未満の場合はリダイレクトするか、任意のサイズにすることです。

これにより、ページが画面サイズ検出スクリプトを解析するのを待ち、画面が小さすぎるかどうかを確認してからリダイレクトする必要があるため、ページの読み込みが少し遅くなります。モバイルデバイスでは時間がかかり、読み込み時間が遅いため、ファンを作ることはできません.

レスポンシブデザインは最適なソリューションです。一歩下がって、サイトを 2 つの異なるサイトに分割する理由と、両方を常に維持できるようにするかどうかを検討する必要があると思います。

score 2 · Accepted Answer

2

開始するのに適したもう 1 つの場所: http://html5boilerplate.com/

于 2012-08-06T18:34:11.597 に答える

score 1 · Accepted Answer

レスポンシブデザインの代わりに、DDR を使用してコンテンツを特定のモバイルデバイスに合わせて調整できます: http://wurfl.sourceforge.net

score 1 · Accepted Answer

メディアクエリを使用すると、さまざまなデバイスのスタイルを設定し、相互の html を保存できます...

5 に答える 5