Jquery 用一个div启动两个动画-如何连接这两个脚本以及将动作放在何处？

我需要一些帮助 我想在我悬停一个div时启动两个动画（它是一个按钮，顶部我想要淡入颜色，底部我想要一个向下滚动的不透明度）。我在这里检查了几个问题，我理解它应该如何工作，但我对jquery真的是新手，我被困在如何使两件事同时工作。。。我应该把悬停动作放在哪里

以下是我要转换为一个的两个脚本：

汇总：

$(function() {
    $('.hoverImg').css({"top" : "-170px"});
    $('.jwrap').hover(function() {
        $(this).children('.hoverImg').stop()
            .animate({"top" : "0"}, 300);
    }, function() {
        $(this).children('.hoverImg').stop()
            .animate({"top" : "-170px"}, 300);
    });
});

褪色：

这是html：

<div class="jwrap">
    <img src="image/Q1bigOff.png" alt="Image1"  />
    <img src="image/Q1bigOn2.png" alt="Image2" class="hoverImg" />
</div>

<div class="fadehover">
<img src="image/Q1Off.png" alt="" class="a" />
<img src="image/Q1On.png" alt="" class="b" />
</div>

---

现在，我猜我可以在这两种效果的基础上做一个大动作，让我的动作在悬停时启动？如果你能帮我写代码。。。我将非常感激。

我相信以下是您想要做的：

我把动画移到函数上，这样我们就可以在任何需要的地方触发它们。使用jquery find方法，我确保只为父div的子元素设置动画。您需要使用jquery select函数包装

this

，以访问jquery函数，如下所示：

$（this）

---

出于测试目的，将父div的背景更改为红色。

您能举个代码示例吗？这听起来相对简单，但有点不清楚你想要你的动画做什么。好主意。这里是：虽然我粘贴了第二段代码，但它不起作用（对不起，我不知道如何正确粘贴它！）Genetious。它工作得很好。非常感谢您抽出时间回答。我会研究你的解决方案，你救了我！你能做一个更新的JSFIDLE吗？这可能是一个小小的疏忽。（编辑）现在我可以完美地工作了：但我需要制作这些可点击的按钮（链接）。我该怎么做？html中的任何更改似乎都会破坏Effector的功能，而不是您需要移动代码才能使用添加的链接的图像。。。我没有足够的时间，但首先将链接环绕在图像周围，并使用

display:block并从那里开始工作。已解决@sg3s！我在class=“a”图像中添加了链接。再次感谢您的帮助，jquery大师；）
<div class="jwrap">
    <img src="image/Q1bigOff.png" alt="Image1"  />
    <img src="image/Q1bigOn2.png" alt="Image2" class="hoverImg" />
</div>

<div class="fadehover">
<img src="image/Q1Off.png" alt="" class="a" />
<img src="image/Q1On.png" alt="" class="b" />
</div>