3

私はイオンフレームワークを使用しています。

次のコードを使用しています。

<div class="list list-inset">
  <label class="item item-input">
    <i class="icon ion-search placeholder-icon"></i>
    <input type="text" placeholder="Search" ng-model="data.searchText.name">
  </label>
</div>

公式ドキュメントから直接取得したものです: http://ionicframework.com/docs/components/#input-icons

全体的に比較的うまく機能しますが、標準の Android ブラウザーでは失敗します (物理的な HTC One X 4.0.4 および Genymotion Galaxy Nexus 4.3 でテスト済み)。

Weinreを使って要素を調べてみた

ここに画像の説明を入力

CSSを変更してみました:

.ion-search:before {
  font-family:"Times New Roman" !important;
  color: black;
  content: "wider wider \f21f"; 
}

ここに画像の説明を入力

:pseudo クラスがサポートされているかどうかを確認しました

http://caniuse.com/#feat=css-gencontent

それらが実際にサポートされていることを確認するために簡単なデモを作成しました(サポートされています)

http://plnkr.co/edit/o5BK6KqTk1MNrlMOI7o5?p=preview


そして、この段階で私は質問する権利があると感じています...アイコンを機能させるには何が必要ですか?

(どうもありがとう)

更新: http://bit.ly/aaaabbbccccアイコンはストック ブラウザーで動作します。コードで動作しない理由をまだ理解しようとしています...

更新: https://android.stackexchange.com/a/19816/59510 - ブラウザのキャッシュ/ローカル ストレージ/その他の設定を削除する方法を説明する便利なリンク

更新: http://1drv.ms/1fWdHpi - ビデオを録画しました...非常に多くの可能な状態で断続的です。

4

0 に答える 0