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，但这不可靠，因为实际上可以在调整大小时将鼠标移出元素。