30种炫酷CSS鼠标滑过按钮特效

所属分类:UI-悬停

 7109  129  查看评论 (5)
30种炫酷CSS鼠标滑过按钮特效 ie兼容10

使用方法

1、解压后复制css文件夹下的main.css到项目的css文件夹

2、复制js文件夹下的jquery-2.1.1.min到项目的js文件夹

3、引用css文件

<link rel="stylesheet" type="text/css" href="css/main.css" />

4、引用jquery

<script src="js/jquery-2.1.1.min.js" type="text/javascript"></script>

5、创建按钮

按钮通过div实现,在需要创建按钮的地方插入??

<div class="sim-button button1"><span>登录</span></div>

6、具体示例可参考解压根目录下的index.html


相关插件-悬停

c的鼠标滑过图片遮罩层动画jQuery插件

nsHover是一款简单实用的鼠标滑过图片遮罩层动画jQuery插件。该插件可以在图片或块级元素上制作鼠标滑过时的遮罩层动画效果,它可以设置遮罩层的前景色和背景色,可以制作圆形图片等,非常实用。
  悬停
 8071  59

jquery hover鼠标悬停遮罩显示

jquery hover鼠标悬停遮罩显示
  悬停
 5017  31

9种CSS3 blend模式制作的鼠标滑过图片标题特效

9种CSS3 blend模式制作的鼠标滑过图片标题特效
  悬停
 7304  92

CSS3 鼠标经过3D翻转动画

CSS3鼠标经过图片3D翻转动画代码
  悬停
 3477  53

讨论这个项目(5)回答他人问题或分享插件使用方法奖励jQ币

    shinsou 0
    2017/1/6 10:01:22

    非常不错,正在努力学习

    回复
    没见过的海S 0
    2016/12/5 14:12:22
    请问怎样在鼠标悬停的时候,文字能变色?从白变成其他的颜色,  我加在  before或者 hover before 里 都没有用 回复
    ztt_tongchuan 0
    2016/12/2 13:12:01
    这个效果还不错 回复
    HuHuaChuan 0
    2016/11/30 10:11:24
    不用引入jQuery吧,根本就没用到,你这使用方法误导人啊
             0
        2017/2/28 16:34:34

        貌似是的 css3的效果

    回复
取消回复