Question

我正在尝试使用jQuery mobile触发事件，当设备的方向发生变化时，该事件会自动重新加载页面。我使用max-device-width, orientation:landscape,和orientation: portrait编写了媒体查询。由于<video>无法正确扩展...我能想到的唯一解决方案是将页面刷新到正确的媒体查询，同时旋转设备。

我该怎么做呢？感谢。

Answer 1

谢谢那些回答的人，但我发现了这个并使用了它并且它运行得很好。

<script type="text/javascript"> // RELOADS WEBPAGE WHEN MOBILE ORIENTATION CHANGES  
    window.onorientationchange = function() { 
        var orientation = window.orientation; 
            switch(orientation) { 
                case 0:
                case 90:
                case -90: window.location.reload(); 
                break; } 
    };

Answer 2

这个怎么样？

$(window).on('orientationchange', function(e) {
     $.mobile.changePage(window.location.href, {
        allowSamePageTransition: true,
        transition: 'none',
        reloadPage: true
    });
});

最好将orientationchange事件命名为特定页面。

jQM docs on orientationchange event

Answer 3

请尝试使用以下代码重定向定位事件页面，对我来说效果很好

if (window.DeviceOrientationEvent) {
    window.addEventListener('orientationchange', function() { location.reload(); }, false);
}

由于

Answer 4

<script type="text/javascript">
window.addEventListener("orientationchange", function() {
        console.log(screen.orientation);
}, false);
</script>

Answer 5

使用jQuery

$(window).bind('orientationchange', function (event) {
    location.reload(true);
});

如何在方向改变时重新加载网页？

5 个答案: