Jquery实现鼠标经过时替换原样式

发表于2015-06-04 10:40:34来源于创想网页设计工作室

次点击[] [] [] [打印] [关闭窗口] [评论]

欢迎大家加入创想工作室QQ群 网络瘫痪上不了网?电脑出故障?找破解软件?加入创想工作室QQ群,向大神求助,一步解决问题!QQ群号码:326338868[点此获取更多QQ群]
有时候我们想实现当鼠标放经过时出现另外的效果,虽然在CSS里可以解决,但是可能对IE6不兼容,所以现在分享一种通过Jquery实现的办法。
 
<script type="text/javascript" src="https://www.22ba.com/templates/js/jquery-1.8.3.js"></script>
<script type="text/javascript">
//jQuery改变鼠标样式
 $(function(){
  //当鼠标滑入时将mousehover换成current
  $('.mousehover').hover(function(){
    $(this).addClass('current');  
   },function(){
    //鼠标离开时移除current样式
    $(this).removeClass('current'); 
   }
  );
 });
</script>
 
<div class="mousehover"></div>
 
然后就可以在CSS里面分别写mousehover和current的样式了。
 

鼠标离开时效果
 

鼠标经过时效果

© copyright 2002-2024, 22BA.COM All Rights Reserved

网站备案号:粤ICP备19114910号

ChuangXiang Design Studio - WebDesign & Internet Marketing

关于我们业务范围联系我们开心一刻网站地图

QQ群一:326338868QQ群二:78712271

QQ群三:193078177

邮箱:news@22ba.com

地址:深圳市福田区金田路现代国际大厦2606