如何在屏幕上添加div调整大小

Question

我希望在达到特定屏幕大小（如css媒体查询）时替换div位置。 我尝试过，但获取屏幕尺寸时遇到了一些问题。 这是我迄今为止所做的。

http://jsbin.com/izize3/60/edit

$(window).resize(function() { 
    var width = $(window).width(); 
    if (width >= 768 || width <= 979) { 
     $('#div1').appendTo('#container'); 
    } else if (width > 979) { 
     alert("else if is executed"); 
     $('#div2').appendTo('#container'); 
    } else { 
     alert("Default else"); 
    } 
}); 

Answer 1

由于您使用的是第一个if语句：

if (width >= 768 || width <= 979) 

任何宽度> 768会通过这个条件。

您应该改用：

if (width >= 768 && width <= 979) 

顺便说一句，请考虑调试使用console.log()，而不是alert()。

http://jsbin.com/izize3/73/edit