CSS調整大小：兩種長寬比

Question

我試圖保持長寬比爲1：1 div標記與CSS resize屬性。是否有可能這樣做？

This example沒有寬高比。有什麼建議麼？

Answer 1

你可以把 「調整：水平」，然後用JavaScript調整的其他方式：

標記：

<div id="elementID" style="width:200px;height:200px;background:#000;resize:horizontal;overflow:hidden;"></div> 

JS：

jQuery('#elementID').mousemove(
    function(e){ 
     var elem = jQuery(e.target); 
     elem.height(elem.width());   
    } 
)​ 

http://jsfiddle.net/valentinas/kFmY8/121/

問題是你需要檢查一些元素如何改變。 AFAIK在調整元素大小時不會觸發事件，因此您必須定期檢查才能獲得可靠的結果。我的例子觀察mousemove，但這不可靠，因爲實際上可以在調整大小時將鼠標移出元素。