1

モバイルブランチを持つサイトを構築しています。PC の多くのブラウザが同じビューを取り、正常に動作するため、サイトの構築に成功しました。

モバイルはおそらくモバイル chrome または Firefox モバイルからサイトを閲覧できるので、今はサイトの構築に取り組んでいます。私はそれをしましたが、小さな問題に直面しています。

サイトの多くのページには、モバイルを使用してクリックするとわかるテキストボックスがあります-たとえば、galaxy note 2-ソフトキーボードは画面に表示されます。このプロセス中に2つのことが起こります。

1- クリックした特定のテキスト ボックスに到達するまで、画面が自動的にズームされます。解決策：このコマンドで解決したので、画面がズームしなくなりました。

2- インクルード ファイルを含むページがある場合、メイン div は上記の div (インクルード ファイル) に到達するまで位置を変更し、ホール ページは順序付けされません。

最初に、私が言いたいことについて簡単な例を示します。

注：私のバックエンドはYiiフレームワークを使用したphpです。情報だけです^ _ *

page.php:

    <div id="div1" style="width:100%;position:relative;margin-bottom: 10px"><?php 

       if (Yii::app()->user->isGuest)
      include 'flash.php'; ?></div>


      <div id="div2" style="width:100%;position:relative;margin-bottom: 10px">
     <form action="getup" method:"post"> 
     <input type="text"  name="text1" >
     <input type="text" name="text2" >
     // submit button

      </form>

この簡単なコードの後、何が起こっているのかを正確に示します。モバイル クロム ブラウザからページを参照すると、ページが順序付けられますが、たとえば text1 として任意のテキスト ボックスをクリックすると、DIV2 自体が移動します。 DIV1 -included file- の上に移動します。これは、ソフト キーボードが画面の後半に表示されるためです。

この例の後、私は私の質問に反対します:

私の質問は次のとおりです: ソフト キーボードがモバイル画面に表示された後に DIV2 で発生している上昇プロセスを停止するコード (CSS または Java Script) はありますか?

4

1 に答える 1

0

おそらく、この動作は使用している css に関連していますか? インライン スタイルから削除position:relativeしてみてください。おそらく役立つでしょう。もう 1 つのことは、入力が自己終了タグである必要があり、div2 終了タグが欠落していることです。デフォルト値であるため、div タグの幅を 100% に設定する必要はありません。

于 2013-09-16T09:08:23.950 に答える