html5鼠标悬停图片放大的原理,jQuery当鼠标悬停时放大图片的效果实例

这个效果最初源于小敏同志的一个想法，刚开始做的时候只能实现弹出的图片是固定的，不能随鼠标移动，最后加以改善，终于实现了比较理想的效果。今天就把制作该效果的经验与大家一同分享。先看看最终效果演示：

HTML结构部分：

先编写一个无序列表的结构，a标签中的img标签用来存放小图片，a标签添加一个rel属性，用来存放大图片的路径。

• 
• 
• 

CSS样式表部分：

bigimage是用jQuery创建的一个p标签的id，用来存放大图片，设置其样式为绝对定位，并先隐藏。给a标签添加一个黑色的背景，是为了给图片变暗的效果做铺垫。就这样，一个简单的相册效果就做好了。

u