我可以在“此”之后添加更多内容吗？在jQuery？ [英] Can I add more after "this" in jQuery?

问题描述

当我将鼠标悬停在图像上时，我正在制作一个淡入淡出图像和div的图像。我有两个问题：

I'm working on a script that fades in and out both an image and a div I have set behind the image when you hover over the image. I'm having two problems:

1. 图像和div上的淡入淡出似乎没有以相同的速度移动虽然我把它们设置为。

1. The fades on the image and div don't seem to move at the same speed even though I have them set to.

我无法弄清楚如何让div只显示你悬停的图像。如果我可以键入（thisdiv.info）作为对象，它将正常工作。有没有办法做到这一点？

I can't figure out how to get the div's to only show for the image you hover over. If I could type ("this" div.info) as an object, it would work fine. Is there a way to do that?

我无法获得 $（。 info，this）， $（this）.find（。info），或 $（。 info，$（this）.closest（li））工作。

I can't get $(".info",this), $(this).find(".info"), or $(".info", $(this).closest("li")) to work.

结果：我找到了解决方案。我能够通过使用lthibodeaux的建议并使用 $（。info，$（this）.closest（li））作为对象来使其工作。制作所有函数 .fadeTo 转到此处获取结果：
http://jsfiddle.net/Z5p4K/7/

Result: I have found the solution. I was able to get it to work by using lthibodeaux's suggestion and using $(".info", $(this).closest("li")) as the object and making all the functions .fadeTo go here for the result: http://jsfiddle.net/Z5p4K/7/

编辑：

• 我发现图像和div动画确实以相同的速度移动，只是图像只在悬停时设置了z-index，所以如果你把鼠标移开图像当动画正在运行时，它看起来会以不同于div的速度移动，而实际上图像在div后面时，它似乎只是以不同的速度移动，因为当div变得不可见时你可以看到它背后的图像但是当它变得不透明时，图像消失了（让你觉得当图像前面的div真的时，图像变得不可见）。通过将z-index属性从 ul.columns li：hover img 移动到 ul.columns li img 。

当你在它上面盘旋时，div只有一个边框。通过将边框属性从 ul.columns li：hover .info 更改为 ul.columns li .info

The div only had a border around it while you hovered over it. This was easily fixed by changing the border properties from ul.columns li:hover .info to ul.columns li .info

查看最终版本： http://jsfiddle.net/tV9Bw/

这是最终版本，因为我再也找不到任何问题任何代码;一切都经过优化，没有任何故障，看起来很棒。

This is the final version because I can no longer find any problems with any of the code; everything is optimized, there are no glitches, and it looks great.

感谢所有回答的人和易江编辑这篇文章的格式更好。我是这个网站的新手，所以我不确定如何正确格式化我的问题。

Thanks to everyone who answered and to Yi Jiang for editing this post with better formatting. I'm new to this site so I wasn't sure how to properly format my question.

非常感谢artyom.stv修复脚本中我不知道如何修复的最后一个小故障。

and a Huge thanks to artyom.stv for fixing the last glitch in the script that I didn't know how to fix.

推荐答案

你有一般的想法。关于选择器你应该知道的一件事是你能够将第二个参数定义为选择器的范围，即

You've got the general idea. One thing you should know about a selector is that you are able to define a second argument as the scope of the selector, i.e.

$("selectorString", scopeObject)

在你的情况下，使第二个参数 $（本）.closest（ 里）。它将找到包含您的图像的列表项，并选择 .info 该容器的后代：

In your case, make the second argument $(this).closest("li"). It will find the list item containing your image and select .info descendants of that container:

$(".info", $(this).closest("li")).fadeIn(1000);

这篇关于我可以在“此”之后添加更多内容吗？在jQuery？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！