jQuery使鼠标可以滑动图片移动效果。
在Web应用程序中，鼠标是最常见和最频繁的操作，当用户移动鼠标时浏览页面，提醒一些交互效果将增强用户体验，同时也使用户感觉在页面中及时与他沟通，增加用户页面停留时间，增加深度访问的可能性。今天，数量以你做一个简单的例子。当鼠标移动到图片时，图像会向上移动。鼠标离开后，图片将回到原来的位置。
首先，让我们来做页面布局，如下图所示：
版面部分：
风格部分：
UL，李{
显示块；
保证金：0；
填充：0；
列表样式：无；
}
{ UL
宽度：800px；
210px高度；
边境：1px solid # 333；
保证金：100px汽车；
填充物：0 5px；
}
{李
职位：相对；
浮点数：左；
宽度：190px；
身高：190px；
保证金：10px 5px；
}
{ IMG
位置：绝对；
顶部：0；
左：0；
宽度：100%；
身高：100%；
光标：指针；
}
在这里，我们需要介绍jQuery插件库，并建议尽可能使用jQuery，因为许多插件都是基于jQuery开发的。
动画功能的实现主要是使用jQuery提供的悬停方法。此方法的语法是：
$（'demo）。Hover（功能）（function（）{ } { }）；
这里，悬停方法可以接收两个参数。第一个参数对应鼠标移动到时间的方式，第二个方式代表鼠标移动时的方式。
示例的js部分是：
$（函数（）{（））
$（'img）。Hover（function（）{）
$（这个）动画（{
'顶'：' 10px
}，正常）；
}函数（）{（）
$（这个）动画（{
顶：'0px
}，正常）；
}）；
}）
下面是通过动画方式移动图片的方法。在CSS中的位置，当鼠标移动时，图像移动到10像素。当鼠标移出时，图片将恢复到原来的位置。
上面的例子只是一个简单的用法描述，更多的特效是在动画的方法下写的，同时，除了动画之外，还可以做文字隐藏显示、图片替换等。
以上是本文的全部内容，希望能对您有所帮助，希望大家多多支持。