当鼠标滑过父 div 时尝试定位子 div 的单个实例时出现问题。
当页面上只有一个 .slidswap_moused_over
(父)类实例时,当前编写的代码可以正常工作,但如果有多个实例,则两者都保持相同的宽度。
这是我拥有的“最有效”的 jQuery:-
jQuery(function() {
jQuery(".slidswap_moused_over").mousemove(function(e) {
var offset = jQuery(this).offset();
var relativeX = (e.pageX - offset.left);
var relativeY = (e.pageY - offset.top);
jQuery(".slidswap_left_image").css({ "width": relativeX });
jQuery('.slidswap_drag_message').css({ "opacity": 0 });
});
});
此处演示 - http://jsfiddle.net/5DjPw/5/
我知道我应该使用 .parent、.children、.siblings 或 .next,但我不确定语法。
如有任何帮助,我们将不胜感激:)
最佳答案
使用this
的实例
jQuery(".slidswap_moused_over").mousemove(function(e) {
var offset = jQuery(this).offset();
var relativeX = (e.pageX - offset.left);
var relativeY = (e.pageY - offset.top);
jQuery(".slidswap_left_image", this).css({ "width": relativeX });
jQuery('.slidswap_drag_message', this).css({ "opacity": 0 });
});
关于javascript - 使用 jQuery mouseover 定位单个类的子实例,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/24782488/