1

HTML

身体：

<div id="site_content">
    <p id="orientation">Rotate device to determine orientation</p>
    <div class="rotateDevice" id="img_landscape">
       <img src="img/tablet_landscape.png" alt="Rotate your device!" />
    </div> 
    <div class="rotateDevice" id="im_portrait">
       <img src="img/tablet_portrait.png" alt="Rotate your device!" />
    </div> 
</div>

JAVASCRIPT (script.js)

var lastOrientation;
function readDeviceOrientation() {

    if (Math.abs(window.orientation) === 90) {
        // Landscape
        document.getElementById("orientation").innerHTML = "LANDSCAPE";
        document.getElementById("im_portrait").style.display='none';
        document.getElementById("im_landscape").style.display='block';
    } else {
        // Portrait
        document.getElementById("orientation").innerHTML = "PORTRAIT";
        document.getElementById("im_portrait").style.display='block';
        document.getElementById("im_landscape").style.display='none';
    }

    if (lastOrientation !== window.orientation) {
        lastOrientation = window.orientation;
        clearInterval(timer);
    }
}

window.onorientationchange = readDeviceOrientation;

window.onload = function () {
    readDeviceOrientation();
};

readDeviceOrientation();
timer = setInterval(readDeviceOrientation, 1/60);

我想要备用#im_landscape和#im_portrait图像，但通过 javascript 只能使用innerHTML，而不是style.display

请问我该如何解决？

谢谢大家

4

2 回答 2

0

这里

document.getElementById("im_landscape").style.display='block';

应该

 document.getElementById("img_landscape").style.display='block';

因为你的身份证是id="img_landscape"

并且由于 jquery 被标记，您可以使用 hide()、show() 和 id 选择器...看起来干净且易于阅读。

这个

document.getElementById("orientation").innerHTML = "LANDSCAPE";
document.getElementById("im_portrait").style.display='none';
document.getElementById("im_landscape").style.display='block';

结果就像..

$("#orientation").html("LANDSCAPE");
$("#im_portrait").hide();
$("#img_landscape").show();
于 2013-07-11T12:02:26.017 回答
0

检查您的 JS 中的景观 DIV ID，似乎拼写错误的 img_landscape 为 im_landscape ..

于 2013-07-11T12:06:12.120 回答