图片/图形
鼠标滑过图片遮罩层动画jQuery插件
PetitQ
nsHover 是一款简单实用的鼠标滑过图片遮罩层动画 jQuery 插件。该插件可以在图片或块级元素上制作鼠标滑过时的遮罩层动画效果，它可以设置遮罩层的前景色和背景色，可以制作圆形图片等，非常实用。
使用方法
使用该鼠标滑过插件需要引入 jQuery 和 ns.hover.min.js 文件。
也想出现在这里？联系我们吧
<script src="js/jquery.min.js"></script>
<script src="js/ns.hover.min.js"></script>
初始化插件
在页面 DOM 元素加载完毕之后，只需要需要制作鼠标滑过效果的元素上调用 nsHover()方法即可。你可以在父元素上使用该方法，那么它的所有子元素都会被初始化。
<script>
$(container_class_or_id).nsHover({
scaling : false,
speed: 'normal',
rounded: 'normal',
bgcolor: '#ffffff',
bgopacity : 0.5,
bgpic : 'imgs/lens.png',
bgsize : '50%',
bganim : 'fade',
shadow : false,
content: ''
});
</script>
配置参数
| 参数 | 默认值 | 可用值 | 描述 |
| scaling | false | false / 0 / 0.0 - 1.0 | 设置 0.0 - 1.0 的值使元素在鼠标滑过时收缩，或设置为 0 / false 来禁用缩放效果 |
| speed | normal | normal / fast / slow | 设置鼠标滑过是过渡动画的速度 |
| rounded | normal | none(0%) / normal(5%) / circle(50%) / xx% / xx px | 该参数用于控制元素的圆角，你可以将一个元素设置为正圆形 |
| bganim | fade | fade / scale / slide | 遮罩层背景动画的类型 |
| bgcolor | '#ffffff' | 遮罩层的背景颜色 | |
| bgopacity | 0.5 | 0.0-1.0 | 遮罩层背景的透明度 |
| bgpic | imgs/lens.png | 有效的图片路径 | 遮罩层背景图片的位置 |
| bgsize | 25% | 0% - 100% | 遮罩层背景图片的大小 |
| shadow | false | true / false | 是否设置阴影效果 |
| content | '' | 任何有效的 html 内容 | 遮罩层上显示的文字内容 |
| 演示地址 | 下载地址 |
专业提供WordPress主题安装、深度汉化、加速优化等各类网站建设服务，详询在线客服！
也想出现在这里？联系我们吧
