jQuery scale div内容(嵌套div)

Question

如何让红色框与红色框一起缩放？(使用jQuery-UI)

http://jsfiddle.net/Y54EB/1/

这是基本代码,CSS:

#outer {
    position:relative;
    height:100px;
    width:150px;
    z-index:1;
    background:#F00;
}
#nested {
    position:absolute;
    left:50px; top:20px;
    width:50px; height:20px;
    z-index:2;
    background:#00F;
    cursor:pointer;
}

和HTML:

<div id="outer">
<div id="nested" onclick="$('#outer').effect('scale', {scale:'content',percent:50}, 1000);" />
</div>

Answer 1

检查这个小提琴:http://jsfiddle.net/techfoobar/Y54EB/4/

解决方案基本上是以%wrt parent指定嵌套div的维度和位置,而不是以像素为单位.