点击预览效果            下载该特效： HTML5+CSS3鼠标悬停图片特效.zip

特效说明：

一款HTML5+CSS3鼠标悬停图片事件网页特效，集合了最流行鼠标悬停图片文字、图片动画移动、渐隐渐显动画特效。

请用支持HTML5+CSS3主流浏览器预览效果。（兼容测试：FireFox、Chrome、Safari、Opera等支持HTML5/CSS3浏览器）

使用方法：
1、调用CSS样式：
<link rel="stylesheet" type="text/css" href="css/normalize.css" />
<link rel="stylesheet" type="text/css" href="css/demo.css" />

2、必要样式：
<link rel="stylesheet" type="text/css" href="css/set1.css" />

3、添加HTML代码：
将<!--效果html开始-->......<!--效果html结束-->之间的html和js代码；放在<body></body>之间。

HTML5+CSS3鼠标悬停图片特效的更多相关文章

  1. jQuery css3鼠标悬停图片显示遮罩层动画特效

    jQuery css3鼠标悬停图片显示遮罩层动画特效 效果体验:http://hovertree.com/texiao/jquery/39/ 效果图: 源码下载:http://hovertree.co ...

  2. 15款css3鼠标悬停图片动画过渡特效

    分享15款css3鼠标悬停图片动画过渡特效.这是一款15款不同效果的css3 hover动画过渡效果代码.效果图如下: 在线预览   源码下载 实现的代码. html代码: <div class ...

  3. CSS3鼠标悬停图片上浮显示描述代码

    效果:http://hovertree.com/texiao/css3/20/ 效果图: 代码如下: <!doctype html> <html lang="zh" ...

  4. css3鼠标悬停图片边框线条动画特效

    css3鼠标经过内容区时,边框线条特效效果制作.   html: <div class="strength grWidth hidden"> <div class ...

  5. CSS3鼠标悬停图片动画

    鼠标放到图片上后: demo地址:demo div: <div class="wai"> <a href="#"> <div cl ...

  6. css3鼠标悬停图片渐显飞入效果

    body程序: <div id="bei"> <div id="img"><img src="xianzi.png&qu ...

  7. css3 鼠标悬停图片动画

    <div class="grid"> <figure class="effect-milo"> <img src="im ...

  8. css3鼠标悬停图片抖动效果

    提供一个参考的链接 http://demo.lanrenzhijia.com/2015/pic0113/

  9. HTML5/CSS3鼠标悬停动画菜单按钮

    在线演示 本地下载

随机推荐

  1. oracle drop table and purge

    一.drop表 执行drop table xx 语句 drop后的表被放在回收站(user_recyclebin)里,而不是直接删除掉.这样,回收站里的表信息就可以被恢复,或彻底清除. 通过查询回收站 ...

  2. SoundPool没有声音的问题

    在项目中需要播放一个提示,很短的一个声音,Android中播放声音有两种方式:MediaPlayer和SoundPool.相对来说SoundPool比较轻量级一些,多用在播放比较短急的声音,Media ...

  3. 20151216JqueryUI学习笔记---按钮

    按钮(button) , 可以给生硬的原生按钮或者文本提供更多丰富多彩的外观. 它不单单可以设置按钮或文本,还可以设置单选按钮和多选按钮.一． 使用 button 按钮使用 button 按钮 UI ...

  4. 彻底理解PHP的SESSION机制

    http://www.cnblogs.com/acpp/archive/2011/06/10/2077592.html 一.默认机制,用磁盘文件来实现PHP会话.php.ini配置:session.s ...

  5. springmvc中url-pattern的大坑

    <servlet> <servlet-name>springmvc</servlet-name> <servlet-class>org.springfr ...

  6. WinEdit7 破解方法

    最近遇到了winEdit7 超过试用期的问题,找了下解决方案. 这个靠谱,通过在每次退出时自动删除注册表信息,达到无限试用的目的: https://lttt.blog.ustc.edu.cn/2012 ...

  7. UIWebView和UIActivityIndicatorView的结合使用

    环境:Xcode6.1 UIWebView是iOS开发中常用的一个控件,是内置的浏览器控件,我们可以用它来浏览网页,加载文档等.这篇文件将结合UIActivityIndicatorView控件制作一个 ...

  8. C#微信开发之旅--自定义菜单

    上一篇说道基本信息的回复<C#微信开发之旅--基本信息的回复>,当中就说到文本信息的回复,其他信息的回复,可以参考下开发文档中回复信息的格式进行修改就可以. 下面来实现下自定义菜单.据我了 ...

  9. 根据id设置、获取元素的文本和value

    /** * 根据id获取元素文本 * @param {String} id|元素id * return {Integer || String} text */function getText(id){ ...

  10. IOS 学习笔记 2015-03-22 OC-API-日期

    一 API 1 NSdate 2 NSDateFormatter 二 适用场景 1 获取当前日期 2 增加时间差 3 比较时间差 4 返回较早时间 5 日期格式话 6 日期转字符串 7 字符串转日期 ...