鼠标悬停图片文字动画效果

发布时间:2016-01-15 11:29

所属分类:特效素材 - 图片特效

鼠标悬停图片文字动画效果

鼠标悬停图片文字动画效果

效果描述:

多个图片列表排列后,鼠标悬停在其中一个图片上后,显示标题以及图片文字介绍效果

由下往上滑动展示出来,背景颜色半透明,默认80%透明度,需要的可以自己修改背景颜色以及透明度

原理:

利用jquery的animate动画效果,将遮罩显示的text部分相对定位在li的左侧以及底部,默认高度为0

当鼠标悬停在图片上后,将高度修改为与li的高度一致,这样就会出现一个动画效果

使用方法:

1、将css样式引入到你的网页中

2、将body中的代码部分拷贝到你需要的地方即可


下面是js特效和素材的预览和下载地址,压缩包的解压密码都是:www.phplearn.cn
站内全部“资源/素材”来自网络,仅供大家学习与参考,如果侵权,请来信具体告知。