jquery鼠标悬停效果插件

所属分类:UI-悬停

 34529  523  查看评论 (14)
分享到微信朋友圈
X
jquery鼠标悬停效果插件 ie兼容6

使用方法

引入jquery库文件

引入jquery.niceHover.js

<script type="text/javascript" src="jquery.niceHover.js"></script>

引入插件所需css niceHover.css

在需要创建hover效果的块节点上调用插件方法

$(".box,.box1").niceHover({
   color:"#FF7C54",
   weight:3
});

参数说明:

color:指定hover效果中线条的颜色,可以是任意css颜色值。

weight:指定hover效果中线条的粗细,默认为2。

注意事项:

创建效果的节点容器必须是有宽高的。

css可以不用引入,直接复制里面的代码到自己的样式文件即可


相关插件-悬停

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

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

图片添加遮罩

根据鼠标进入的位置插入遮罩
  悬停
 30765  396

CSS3圆形图片鼠标经过旋转效果

CSS3圆形图片鼠标经过旋转效果,图片上有简短标题和说明,兼容主流浏览器
  悬停
 28459  396

jQuery鼠标悬停图片分享按钮动画

这款jQuery插件可以实现鼠标滑过图片时在图片上方创建任意的元素,包括分享按钮和图片文字描述等。这些按钮和文字可以悬浮在图片的任意位置,同时你也可以自己定义这些图片上方的元素出现时的动画特效。
  悬停
 36065  470

讨论这个项目(14)回答他人问题或分享插件使用方法奖励jQ币 评论用户自律公约

    梦回故里 0
    2018/8/10 11:13:10
    使用不是很方便,另外有bug,鼠标多次快速经过,线条会卡住不动。
        marvengong0
        2018/8/10 11:14:39
        谢谢,
    回复
    蓝调 0
    2017/8/14 15:30:06

    太棒了,大神们都是怎么修炼成的呢!

    回复
    gg 0
    2017/7/13 8:57:21

    支持支持 做的很不错

        marvengong0
        2017/8/12 22:56:17

        谢谢

    回复
    慕兮 0
    2017/4/26 16:38:27

    效果还是不错的

    回复
    我的2009 0
    2016/7/21 14:07:31
    两个以上div不能同时设置不同颜色
        marvengong0
        2016/7/21 14:07:30
        两个div分别调用插件方法就可以了
    回复
    静,守候等待 0
    2016/5/25 18:05:16
    css3能实现这样的效果吗
        marvengong1
        2016/5/26 14:05:41
        也可以实现的,但是需要事先就在你的块儿里面放好那四个线条,悬停的时候让四个线条执行动画,我这个插件相当于是js构造的线条,不需要事先写好
    回复
    你若安好便是晴天 0
    2016/5/3 15:05:30
    很不错的
        marvengong0
        2016/5/3 17:05:14
        谢谢,我会继续发的
    回复
    白月光 0
    2016/4/9 13:04:26
    白月光 0
    2016/4/9 13:04:26
😃
  • 😀
  • 😉
  • 😥
  • 😵
  • 😫
  • 😘
  • 😡
  • 👍
  • 🌹
  • 👏
  • 🍺
  • 🍉
  • 🌙
  • 💖
  • 💔
😃
  • 😀
  • 😉
  • 😥
  • 😵
  • 😫
  • 😘
  • 😡
  • 👍
  • 🌹
  • 👏
  • 🍺
  • 🍉
  • 🌙
  • 💖
  • 💔
取消回复