1

CodeIgniter フレームワークを使用してレスポンシブ サイトを構築していますが、誰かが助けてくれることを望む問題に遭遇しました。

サイト自体は基本的に、大規模な情報データベースを検索し、結果を適切に表形式で表示する手段です。

携帯電話の画面領域が不足しているため、これらのデバイスでは、フル デスクトップ ブラウザで利用できる 20 以上の検索語句と検索結果のうち 3 つだけに絞り込まれます。つまり、これらの小さなデバイスで検索され、ユーザーに表示されるデータベース。

とにかく、メディアクエリを使用してレスポンシブにページをスタイルする方法は知っていますが、デバイスの画面サイズに応じて検索フォームのコンテンツを実際に構築する方法はありますか?

たとえば、次のように少し動作することがわかります。

  1. ユーザーが検索ページに移動
  2. ページが携帯電話を使用していることを検出
  3. ページの検索入力フォームは 3 つのフィールドのみで構成されています

または、デスクトップ ブラウザを使用している場合:

  1. ユーザーが検索ページに移動
  2. ページがデスクトップ ブラウザ上にあることを検出
  3. ページの検索入力フォームは、20 以上のフィールドで構成されています

これが意味をなすことを願っています。「タブレットは?」質問されるかもしれませんが、それらもケータリングされますが、提示される検索フィールドの数はまだ決定されていません。

すべてのアイデアとアドバイスを感謝します。トニー。

4

3 に答える 3

2

ユーザー エージェント クラスを使用して、ユーザーがサイトにアクセスしているときに携帯電話を使用しているかどうかを検出できます。

もちろん、これにはいくつかの欠点がありますが、ユーザーがモバイル デバイスを使用している場合にサーバー側を認識できるようになります。私が見る最大の欠点: ユーザーが未知のユーザー エージェント (実際には携帯電話) を使用している場合、3 フィールドではなく 20 フィールドを提供することになります。

于 2012-04-06T14:24:03.640 に答える
1

CSS3 を使用すると、ユーザー エージェントまたはモダナイザーを実行する必要がなくなります。

何かのようなもの:

@media screen and (max-width: 360px) {
  table td:nth(4n) { display: none; }
}

必要なものを提供できるはずです。それを @media mobile に変更することもできます .... それもそれを拾うかどうかを確認しますが、デバイスごとに画面幅が異なるため、私はこのようにすることを好みます。

于 2014-02-27T02:54:21.720 に答える
0

検出はJavaスクリプト/HTML/ CSSを介して実行できると思います(他のオプションについてはよくわかりません)

そして、これはすべてを解決することができます。CIを使用する必要はありません。

http://modernizr.com/

より多くのオプションが認められます。:)

于 2012-04-06T13:20:50.550 に答える