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

Question

我希望在达到特定屏幕尺寸时替换div位置，如css媒体查询。 我尝试了但是在获取屏幕尺寸方面遇到了一些问题。 这是我到目前为止所做的事情。

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)

任何宽度＆gt; 768将通过这个条件。

您应该使用：

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

BTW，请考虑调试以使用console.log()代替alert()。

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