2011-01-13 15 views
4

JavaのイベントをAndroidのorientationchangeイベントまたはresizeイベントにバインドしようとしています。これは、Webアプリケーションの要素の幅と高さを変更するためです。この場合、window.innerHeightとwindow.innerWidthを使用して、ウィンドウの現在の高さと幅を取得します。Androidの向きのHTML要素のサイズを変更する

これはiOSとデスクトップデバイスでうまくいきますが、Androidではウィンドウ変数の値を変更する前にこのイベントを呼び出すようです。したがって、誰かがポートレートからランドスケープに切り替えるとき、私はまだポートレートの値を取得しているため、正しくサイズを変更することはできません。誰が問題が何で、どのように私はそれを修正することができます知っていますか?

答えて

4

。 resizeイベントは正しく動作しますが、orientationchangeイベントは正しく動作しません。私はorientationeventが存在するかどうかを調べ、可能であればそれにバインドしてテストしていました。 resizeイベントのみを使用するようにコードを変更し、目的の効果を達成しました。

これは私のコードと一意であるかどうかわかりませんが、それは私のためにそれを修正したものです。

0

は、このためにCSSセレクタがあります。

/*normal styles here */ 
#wrap { 
    width:1024px; 
} 
@media only screen and (orientation:portrait){ 
    /* portrait styles here */ 
    #wrap { 
     width:768px; 
    } 
} 

出典:私は、問題を修正しましたhttp://matthewjamestaylor.com/blog/ipad-layout-with-landscape-portrait-modes

+0

Androidで動作するかどうかわからない、Androidハザード悪いブラウザーではない。 –

+0

高さと幅は画面サイズに依存し、計算する必要があるため、メディアクエリは使用できません。 Androidにはさまざまな画面サイズがあります。 –

0

私は、 "orientationchange" -eventがAndroid 2.2および2.3で期待通りに機能しないことを確認できます。それはあなたが可用性をチェックしたときに表示されますが、その後は起動しません。 Android 1.6と2.1でも動作します。私はあなたと同じように、すべてのAndroidバージョンで「サイズ変更」を使用しました。

2

私の調査では、Webビューのデフォルトのユーザーエージェントを変更すると、このAndroid webviewのバグ(「orientationchange」がwindow.innerHeight Javascript値を変更する前に20-150msが発生する)が存在することが示されました。しかし、私はどのように別のものに関連しているのか尋ねないでください。あなたのprobelmを解決する

しかし、あなたは、次のいずれか行うことができます。

1)あなたのコードから次のユーザーエージェントの変更

webView.getSettings(取り除く)setUserAgentString(「カスタム・ユーザー。 -エージェント");

2)

0

は、質問とDetect rotation of Android phone in the browser with JavaScriptのための答えを見てみましょう代わりに「orientationchange」イベントのイベント「をサイズ変更する」を使用します。方向の変化を検出するためのクロスプラットフォームをカバーしています。
ビューポートまたはウィンドウクロスプラットフォームのサイズを取得するには、http://responsejs.com/またはhttp://verge.airve.com/を参照してください。

関連する問題