Question

我在jQuery .position函数上遇到了问题。

它与CSS3的变换旋转冲突。

我在旋转的div中获得图像左右两侧的位置。

如果我旋转了DIV，.position的结果会因div不旋转而有所不同。

这是div的CSS：

#a{
    position:relative;
    float:left;
    margin-top:100px;
    margin-left:100px;
    -webkit-transform:rotate(30deg);
    width:300px;
    height:300px;
    background-color:#CCC;
}

这是jQuery代码：

$("#img").click(function(){
    alert($(this).position().left);
    alert($(this).position().top);
})

Answer 1

好像.offset()和.position()在不同的浏览器中提供不同的输出，这是一个测试：http://jsfiddle.net/F8Jtt/5/

以下是一个类似的问题，其中包含一个已接受的答案：jQuery .position() strangeness while using CSS3 rotate attribute

Answer 2

是jquery的错误：http://bugs.jquery.com/ticket/8362和http://bugs.jqueryui.com/ticket/6844 jQuery使用offsetParent（）与position而不是calcul rotation和scale parent。 jQuery不支持CSS3。

jQuery .position与CSS3的转换冲突

2 个答案: