This article illustrates how jquery realizes the color of the mouse over the div layer background. Share to everyone for your reference. The implementation methods are as follows:
Copy Code code as follows:
<title>jquery implementation of the induction mouse through the div layer transform layer background color) </title>
<style type= "Text/css" >
. divbox{
height:300px;
width:200px;
Background: #ffffff;
Border:solid 1px #ccc;
Float:left;
margin-right:10px;
}
. divover{
Background: #eff8fe;
Border:solid 1px #d2dce3;
}
#zztj {color: #ffffff;}
#zztj A, #zztj a:link, #zztj a:visited, #zztj a:active {color: #ffffff;}
#zztj a:hover {color: #ffffff;}
</style>
<script src= "/images/jquery.js" ></script>
<script language= "JavaScript" >
$ (function () {
Change the div's class to divover when the mouse is sliding
$ ('. Divbox '). Hover (function () {
$ (this). addclass (' Divover ');
},function () {
Remove Divover style when mouse leaves
$ (this). Removeclass (' Divover ');
}
);
});
</script>
<body>
<div id= "Menu" >
<div class= "Divbox" > Block a</div>
<div class= "Divbox" > Block b</div>
<div class= "Divbox" > Block c</div>
</div><br> tip: If you do not show the preview effect, please <font color=red> refresh the page </font>, because the remote jquery plug-in call, need to load completed to run.
</body>
I hope this article will help you with your jquery programming.