私の小さなフロントエンド (1) -- Android と iOS の違い machine_html/css_WEB-ITnose

特別な新しい技術はありません。モバイル端末で作業中に遭遇した問題を記録するだけです

2016-02-16

WeChat、Alipay、APP ではこれらの問題が発生します

1. Android とiOS違い

1。 、user-scalable = no "＆gt;
＆lt; 2、HTML5は携帯電話のカメラとアルバムを取得する問題
iOSはカメラとアルバムを直接選択できます。

解決策: Android マシンでカメラまたはフォト アルバムを選択できるようにキャプチャ属性を追加します。ただし、マシンのメモリが不足している可能性があり、写真を保存するときにフリーズしてクラッシュします。




********************** ************ *************************



3. キーボードがポップアップすると、元の下部の固定バーが影響を受けます

ページには INPUT 入力ボックスがあり、テキストまたは数字を入力すると、キーボードがポップアップしてページがスクロールし、元の下部の固定バーがフローティングになります。一番下の固定列は、position:fixed を使用して一番下に配置されます。

Android の画面幅は、高さの合計 - キーボードの高さであるため、固定バーはキーボードの上にあり、影響を受けません

ios 下部の固定バーは、ページ上の特定の位置に固定されます。

解決策: iOS でキーボードが表示されるときに、下部の固定バーを相対または絶対の位置に変更し、ページの後ろに配置します。

該当するページには INPUT があります。下部の固定バーには INPUT がありません

************************ ********* ************************

4. input id="txt_Date" type="date"

$("#txt_Date").focus ();

テキストを右揃えにします。

iOS は任意の DIV にフォーカスを使用して日付/時刻ウィンドウを直接ポップアップします。テキストは右揃えにできません。Android は時間入力にのみフォーカスし、カーソルはありますが、ポップアップ ウィンドウはなく、テキストがいくつかあります。右揃えです。

解決策: 入力のスタイルを作成します

ios入力の幅を制限して右揃えにし、フォーカスを使用して任意の位置で日付/時刻ポップアップ ウィンドウを開きます。

Android で入力幅を必要な幅に書き込むには、var DatedivWidth = $("#DateDiv").width();$("#txt_Date").css("min-width", DatedivWidth); を使用します。日付/時刻ポップアップウィンドウを一定の幅内で開くことを許可します

******************************** ******** ************************