Question

我需要Javascript或Jquery来检测屏幕方向，然后为每个方向加载不同的HTML和CSS。

我认为这是我从不同的例子中汇总的好代码，但我不知道完成它所需的代码。

    $(window).on("orientationchange",function(){
    if(window.orientation == 0) // Portrait
    {
    jquery code here to load some external HTML AND CSS
    }
    else // Landscape
    {
    jquery code here to load some external HTML AND CSS
    }
    });

这看起来是否合适，我需要的代码是什么样的？任何帮助都会很棒。

Answer 1

为什么不只是使用CSS媒体查询/响应式设计来制作布局，而不是用JS检测方向然后重新绘制显示？

Answer 2

我认为这可以通过jQuery Mobile

实现

$(document).on("pagecreate",function(event){
  $(window).on("orientationchange",function(){
    if(window.orientation == 0)// Portrait
    {
      //....................
    }
    else
    {
      //...............
    }
  });                   
});

或简单，你必须与$（window）.width（）

进行比较

Answer 3

写下JS代码

screen.addEventListener("orientationchange", function () {
      console.log("The orientation of the screen is: " + screen.orientation);
    });

听取屏幕方向

Answer 4

你的方向正确，但你的代码没有管理所有的情况（例如颠倒的ipad）

使用gist函数作为事件处理程序检查此bind。

P.S。尽可能使用mediaqueries。

用于屏幕方向的Javascript或jquery代码

4 个答案: