jQuery 鼠标悬浮 隐藏显示div

时间:2024-03-03 19:18:32

css样式表中的代码:

.aa{background-image:url(../Images/a.gif)}

.bb{display:none}

asp中的代码:

<div>

<div id="old" class="aa">考核表</div>

<div id="new " class="aa">审核表</div>

</div>

<div id="showOld" class="bb">show me!!!</div>

<div id="showOld" class="bb">show me!!!</div>

<script language="javascript" type="text/javascript">

$(\'#old\').mousemove(function(){//鼠标悬浮在old上时

    $(\'#old\').removeClass(\'aa\').show();//显示

    $(\'#new\').addClass(\'aa\').hide();//隐藏

    $(\'#showOld\').addClass(\'bb\');//显示

    $(\'#showNew\').removeClass(\'bb\');//隐藏

});

$(\'#new\').mousemove(function(){//鼠标悬浮在new上时

    $(\'#old\').addClass(\'aa\').hide();//显示

    $(\'#new\').removeClass(\'aa\').show();//隐藏

    $(\'#showOld\').removeClass(\'bb\');//显示

    $(\'#showNew\').addClass(\'bb\');//隐藏

}); 

</script>