Jquery-在鼠标上方更改图像

我是Jquery新手，正在研究在鼠标悬停上更改图片的一些不错的效果。 我是一个全新的人，所以我不想要求一个完整的解决方案代码（如果有人真的想帮助我，我不会介意我正在学习）

我的目标是：

描述：例如，我有两张图片-A和B。我希望能够在鼠标上方显示图片A和B（仅基于y坐标-左/右移动） 将其更改为图片B，但如图所示（这样图像仍然保留，但仅保留一部分）

也许有人能给我一些有用的文章，告诉我需要什么，让这一切成为现实。此外，小的伪代码将是可怕的正确的方式来构造这个

---

另外，对于新手来说，这是一项艰苦的工作吗

此页面可能对您有用：

您可以使用此处显示的幻灯片示例，将目标和img置于另一个img之上

您可以使用css将图像放置在彼此的顶部。签出“位置：绝对”样式。

试试这个

var mouseX=0，
秒=$（“.second”），
xp=0，
偏移量=10，
clrTimeout=null，
limitX=$（'.container'）.width（）-偏移量；
$（'.container'）.mousemove（函数（e）{
clearTimeout（clrTimeout）；
mouseX=Math.min（e.pageX-$（this.offset（）.left，limitX）；
如果（mouseX
img，
.集装箱{
宽度：200px；
高度：200px
}
.首先，
.第二{
位置：绝对位置
}
.第二{
左：40%
}
.集装箱{
位置：相对位置；
溢出：隐藏；
}