如何在屏幕上添加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