0

Phonegap アプリで方向の変化を検出するために (横向きと縦向きで異なる CSS ファイルを読み込むため) 、ここからいくつかのコードを調整しました。「null のプロパティ 'コンテンツ' を読み取れません」というエラーが発生しました。これは、DOM 呼び出しに何か問題があることを意味します。コードには、これらの疑似要素をプライマリ CSS ファイルに追加することが含まれます。

/*Orientation Detection Hack*/
body:after {
    content: "";
    position: absolute;
    color: transparent;
}

@media all and (orientation: portrait) {
    body:after {
        content: "p";
    }
}

@media all and (orientation: landscape) {
    body:after {
        content: "l";
    }
}
/*end of orientation detection*/

そして、このイベント リスナーは、向きの変更時に疑似要素をチェックします。

/*ORIENTATION CHANGES*/
    //get style of the body:after element
var bodyAfterStyle = window.getComputedStyle(document.body, ":after");

window.onorientationchange = function() {


  navigator.notification.alert(
        'ORIENTATION CHANGELOL',  // message
        'Credits',            // title
        'Credits');              // buttonName

  if(bodyAfterStyle.content == 'p') {

/*whatever
    navigator.notification.alert("Now in Portrait");
    var sheet = document.createElement('link');
    sheet.innerHTML = 'href=\"portrait.css\" rel=\"stylesheet\"  type=\"text/css\"';
    document.body.appendChild(sheet);
end whatever*/
} 
    else if(bodyAfterStyle.content == 'l') {
    //do landscape stuff
  }
}
    /*END OF ORIENTATION STUFF*/
4

2 に答える 2

0

新しい疑似要素orientationchangeのスタイルを取得するには、イベント ハンドラーで計算されたスタイルを要求する必要があります。

ドキュメント オブジェクト モデル CSS W3C 仕様の引用getComputedStyle:

計算されたスタイルは要素ノードに関連付けられているため、この要素がドキュメントから削除されると、この宣言に関連する関連付けられた CSSStyleDeclaration および CSSValue は無効になります。

あなたのケースの説明は、メディアクエリが開始されると疑似要素のインスタンスが変更されるということです。疑似要素は実際には削除され、新しいものに置き換えられます。コードでは、bodyAfterStyle参照は使用できなくなった古いインスタンスを指しています。

于 2013-01-30T11:41:34.427 に答える
0

bodyAfterStyle が失われているようです。その割り当てをイベント関数に移動することを提案します。

于 2013-01-29T12:46:13.127 に答える