点击预览效果            下载该特效： 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. .net core 1.1.0 MVC 控制器接收Json字串 （JObject对象） (一）

    .net core 1.1.0 MVC 控制器接收Json字串 (JObject对象) (二) Json是WEB交互常见的数据,.net core 处理方式是转为强类型,没有对应的强类型会被抛弃,有时 ...

  2. 截获导航控制器系统返回按钮的点击pop及右滑pop事件

    前几天看了@栾小布的一篇文章:Custom backBarButtonItem,在跟着做的时候我又顺便扩展了一些,写此文章的目的是为了总结一下自己所写的东西,方便以后翻看容易,同时也是自己入行iOS一 ...

  3. chrome浏览器频频崩溃，如何解决？

    之前chrome常崩溃,也没有找到原因,就将就着用吧,一直用到今天, 今天连续几次崩了,突然想到,难道是因为我访问的域名没有解析(能想到这个,是因为今天分配公司域名测试的时候常输错),于是就输入一个不 ...

  4. gulp 实践

    文档站YDoc 相关注意事项 sass 编译 目录结构 可以直接使用sass编译 ➜ ydoc git:(v2) ✗ sass ./sass/app.scss ./template/source/ap ...

  5. Eclipse错误

    1.java compiler level does not match the version of the installed java project facet 解决:http://blog. ...

  6. oracle report err:REP-2103 PL/SQL formula returned invalid value or no value

    好多年没用report builder做报表了,最近又开始接触这玩意了,今天修改一个report,调试半天没发现逻辑问题,一直报REP-2103: Column 'CF_report_line_po' ...

  7. C#扫盲之：静态成员、静态方法、静态类、实例成员及区别

    文章目录 1.静态成员.实例成员 2.静态类 3.类的静态成员和非静态成员区别 --------------------------------------分割线------------------- ...

  8. iframe父子窗口取值

    父窗口中操作iframe:window.frames["iframeChild"].document //假如iframe的id为iframeChild 在子窗口中操作父窗口:wi ...

  9. hibernate篇章六--demo（0.准备工作）

    这个demo是学习自:学习不可已 这个章节我们先来说准备工作:Hibernate之第〇解之准备工作 首先: 1.新建java project--hibernate_demo_1: 2.新建src fo ...

  10. 关于利用动态代理手写数据库连接池的异常 java.lang.ClassCastException: com.sun.proxy.$Proxy0 cannot be cast to java.sql.Connection

    代码如下: final Connection conn=pool.remove(0); //利用动态代理改造close方法 Connection proxy= (Connection) Proxy.n ...