如何根據瀏覽器大小以增量爲單位調整元素大小？

Question

我試圖在瀏覽器大小改變時改變DIV的寬度。

不以某種比例可以用百分比處理，但依然與屏幕大小有關。 我試圖做一個div 80％最大的瀏覽器寬度，只要它除以20. 如果屏幕是1000px寬，所以div將是800px，如果屏幕是1024px，所以它仍然是800px（導致1024的80％是819.2，不等於20）。

除了做很多媒體查詢，我不知道該怎麼做。

Answer 1

這應該有希望讓你在路上。它使用jQuery以20px的增量調整div的大小。這並不完美，但這是一個開始。

http://jsfiddle.net/ydtdS/3/

function tale(div,w) { 
if(w%20==0) { 
    $(div).text(w); 
    $(div).css("width",w); 
} else { 
    w = Math.floor(w/20)*20; 
    $(div).text(w); 
    $(div).css("width",w); 
} 
} 
$(window).resize(function() { 
    var windowWidth = $(window).width(); 
    tale(".twenty",windowWidth); 
}); 

tale(".twenty",$(window).width());