3

我找到了以下创造性的接受答案

jQuery('.get-close-to').hover(function() {
    var offset = jQuery(this).css('offset');
    alert( 'Left: ' + offset.left + '\nTop: ' + offset.top );
});

我想知道它.css('offset')是如何工作的，所以我做了一个jsfiddle，但它警告“未定义”。

任何人都可以描述这个，工作并且是正确的方法吗？

评论：

我知道要使用 .offset() 但我并不是要使用它，但我的问题是关于接受的答案的代码是如何工作的.css('offset')...... 就这样。

4

4 回答 4

3

CSS中没有offset属性。与jQuery.css(propertyName)您只能访问存在的属性。其他所有内容都将返回 null。

例如：

jQuery.css('myImaginativePropertyname'); // returns null
jQuery.css('border'); // would return '0px none rgb(0, 0, 0)'

然而

您可以像这样访问 event.target（DOM 元素）：

jQuery('.get-close-to').hover(function(e) {
    var elem = e.target;
    alert( 'Left: ' + elem.offsetLeft + '\nTop: ' + elem.offsetTop );
}, function(e){});

我添加了第二个函数，这样代码就不会被执行两次。如果您在 jQuery.hover() 上只有一个函数作为输入，它将在悬停和模糊中执行。如果添加第二个函数作为参数，第一个函数将在悬停时执行，而第二个函数将在元素模糊时执行。

这是小提琴：http: //jsfiddle.net/JLAK4/2/

有些人可能会争辩改用 jQuery(this).offset()，但是当您已经填充了 DOM 元素并可供您使用时，为什么还要浪费 cpu 周期来进行另一个方法调用呢？jQuery 是一个很好的兼容层，我给你。但是滥用和过度使用它根本没有意义。

于 2013-08-25T09:29:11.193 回答
0

尝试这个：

jQuery('.get-close-to').hover(function() {
    var offset = jQuery(this).offset();
    alert( 'Left: ' + offset.left + '\nTop: ' + offset.top );
});
于 2013-08-25T09:49:58.277 回答
0

我想他想说的是：工作小提琴

jQuery('.get-close-to').hover(function() {
    var offset = jQuery(this).offset();
    alert( 'Left: ' + offset.left + '\nTop: ' + offset.top );
});

但他打错了.css('offset')可能是。

于 2013-08-26T02:50:40.343 回答
0

你想改用 .offset() 吗？

jQuery('.get-close-to').hover(function() {
    var offset = jQuery(this).offset();
    alert( 'Left: ' + offset.left + '\nTop: ' + offset.top );
});
于 2013-08-25T09:25:41.990 回答