2018年04月6日网站服务器迁移完成……

jquery 鼠标悬停(hover)切换 class 属性

jquery 苏 demo 2117℃ 0评论

假如当用户鼠标悬停在一个可点击的元素上时,你希望改变其效果,下面这段代码可以在其悬停在元素上时添加 class 属性,当用户鼠标离开时,则自动取消该class 属性:

$('.btn').hover(function () {
  $(this).addClass('hover');
  }, function () {
    $(this).removeClass('hover');
  });

你只需要添加必要的CSS代码即可。如果你想要更简洁的代码,可以使用toggleClass 方法:

$('.btn').hover(function () { 
  $(this).toggleClass('hover'); 
});

注:直接使用CSS实现该效果可能是更好的解决方案,但你仍然有必要知道该方法。

 

 

打赏

转载请注明:苏demo的别样人生 » jquery 鼠标悬停(hover)切换 class 属性

   如果本篇文章对您有帮助,欢迎向博主进行赞助,赞助时请写上您的用户名。
支付宝直接捐助帐号oracle_lee@qq.com 感谢支持!
喜欢 (0)or分享 (0)
发表我的评论
取消评论
表情