0

そのため、phoneGap/Cordova と Jquery mobile を使用して iPad 用にこのアプリケーションを設計しています。

向きの変更で画像を変更する方法を調査し、Stack Overflow である壮大なリソースを閲覧した後。このコードを実装しました。

// The event for orientation change
var onChanged = function () {

    // The orientation
    var orientation = window.orientation,
        // If landscape, then use "land" otherwise use "port"
        image = orientation == 90 || orientation == -90 ? "landscape" : "portrait";

    // Insert the image
    $('#introimg').html('<img src="images/appimages/' + image + '-intro-page.png">');

};

// Bind the orientation change event and bind onLoad
$(window).bind(orientationEvent, onChanged).bind('load', onChanged);

紹介ページの画像を変更しようとしています。私が使用するhtmlは次のとおりです。

<div data-role="page" id="intro">

        <div data-role="content" class="mycontent" data-theme="a">
            <div id="introimg">
                <img src="images/appimages/portrait-intro-page.png" alt="" width="768" height="1004" id="imglayer1" />
                <br />
                <p id="imglayer2"><a href="#help" data-role="button" data-inline="true" data-theme="a">Start designing</a></p>
            </div>

        </div>  
    </div>

誰が私が間違っているのか言うことができますか、それはおそらく愚かなことですが、私には見えません。どんな助けでも大歓迎です。

4

1 に答える 1

0

これにはクラスを使用できます。

var onChanged = function () {

    // The orientation
   var orientation = (window.orientation == -90 || window.orientation == 90) ? "landscape" : "portrait";

   // Insert the image class
  $("introimg").removeClass("portrait").removeClass("landscape").addClass(orientation);

};
于 2012-08-01T17:40:41.793 に答える