触发：悬停在第一个元素上时悬停在第二个元素上
我正在运行此测试页面： http://joshuacody.net/qworky/
警告：大量 CSS3。这仅在 Safari 或 Chrome 中看起来正确。火狐浏览器是可以忍受的。其他一切都将丢失。
本质上，当我将鼠标悬停在某人的名字上时，我希望它也能触发他们图像上的悬停状态。现在可以了，但我觉得这个解决方案不太优雅。我宁愿不添加更多课程。就是这样：
$('a.name_link').hover(function(){
$(this).parent('p').siblings('img').toggleClass('link_hover');
});
$('img.name_img').hover(function(){
$(this).siblings('p').children('a').toggleClass('hover');
});
我认为以下方法可行：
$('a.name_link').hover(function(){
$(this).parent('p').siblings('img').trigger('hover');
});
知道为什么不行吗？我真的在寻找最干净、最简单的方法来做到这一点。非常感谢！
I've got this test page going on: http://joshuacody.net/qworky/
Warning: Tons of CSS3. This will only look right in Safari or Chrome. Firefox will be tolerable. All else will be lost.
Essentially, when I hover on someone's name, I'd like it to trigger the hover state on their image as well. It's working now, but I feel the solution is inelegant. I'd rather not add more classes. Here it is:
$('a.name_link').hover(function(){
$(this).parent('p').siblings('img').toggleClass('link_hover');
});
$('img.name_img').hover(function(){
$(this).siblings('p').children('a').toggleClass('hover');
});
I thought the following would work:
$('a.name_link').hover(function(){
$(this).parent('p').siblings('img').trigger('hover');
});
Any idea why it's not? I'm really looking for the cleanest, simplest way to do this. Thanks so much!
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（3）
据我了解，jquery悬停方法是它接受两个函数
$('a.name_link').hover( //mouse over function(){ $(this).parent('p').sibling('img').toggleClass('link_hover'); }, // mouse out function(){ } );由于您只声明了第一个方法，那么也许您应该尝试触发 mouseover 方法
$('a.name_link').hover(function(){ $(this).parent('p').siblings('img').trigger('mouseover'); });from what i understand of the jquery hover method is that it accepts two functions
$('a.name_link').hover( //mouse over function(){ $(this).parent('p').sibling('img').toggleClass('link_hover'); }, // mouse out function(){ } );since you're only declaring the first method, then maybe you should try triggering the mouseover method
$('a.name_link').hover(function(){ $(this).parent('p').siblings('img').trigger('mouseover'); });悬停功能应该具有 2 个功能，而不是只有一个功能。尝试将这两个功能都放在那里。
Instead of just one function, the hover function is supposed to have 2 functions. Try putting both functions on there.
事实证明，我可以修改我的 CSS 来做到这一点，将 img 放在锚标记内。
Turns out I could just rework my CSS to do that, putting the img inside of the anchor tag.