点击预览效果            下载该特效： 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. careercup-位操作5.1

    5.1 写程序使整数N中第i位到第j位的值与整数M中的相同. 题目 给定两个32位的数,N和M,还有两个指示位的数,i和j. 写程序使得N中第i位到第j位的值与M中的相同(即:M变成N的子串且位于N的 ...

  2. j2ee学习笔记 javascript 学习

    JavaScript 组成: ECMAScript + BOM + DOM Window对象是JS中的顶层对象 ECMAScript: 规定了一些语法,变量,for循环等等结构 BOM: Browse ...

  3. [RAC] oracle rac 后台进程

    一.RAC后台进程 LMON:LOCK Monitor Processes 也被称为Global enqueue service monitor 监控整个集群状况,维护GCS的内存结构 监控非正常终止 ...

  4. 11.14 noip模拟试题

      题目名称 正确答案 序列问题 长途旅行 英文名称 answer sequence travel 输入文件名 answer.in sequence.in travel.in 输出文件名 answer ...

  5. JavaScript 计算两个颜色叠加值

    function multiply(rgb1, rgb2) { var result = [], i = 0; for( ; i < rgb1.length; i++ ) { result.pu ...

  6. Google Maps API　调用实例

    本实例介绍如何调用Google Maps API,并实现用鼠标标注地图,保存进数据库,以及二次加载显示等. 1.需要新建一个自定义控件(如:Map．ascx),用于显示Google地图: <%@ ...

  7. JavaScript 学习笔记-- ES6学习（一）介绍以及Babel的使用

    本文摘自阮一峰老师的<ECMAScript 6入门>,原文地址:http://es6.ruanyifeng.com/#docs/intro ECMAScript 6 是一个泛指,含义是5. ...

  8. VBA 打印设置相关属性及方法

    打印设置说明,以下均为默认值. With ActiveSheet.PageSetup .PrintTitleRows = "" '工作表打印标题:顶端标题行(R) .PrintTi ...

  9. 【Java咬文嚼字】关键字(二):八个基本数据类型

    本次谈谈java中的基本数据类型.java中8个基本数据类型说多不多说少也不少,相对简单的记忆方式:整数型(byte,short,int,long).浮点型(float,double).逻辑型(boo ...

  10. HDU 4712 Hamming Distance（随机算法）

    题目链接:http://acm.hdu.edu.cn/showproblem.php?pid=4712 题目大意:任意两个数按位异或后二进制中含1的个数被称为海明距离,给定n个数,求出任意其中两个最小 ...