Copy Code code as follows:
<script src= "Js/jquery1.7.js" ></script>
<script type= "Text/javascript" >
$ (function () {
$ (' Div:eq (1) '). css ({' margin-top ': '-=100px '});
$ (' Div:first '). MouseOver (function () {
$ (' Div:eq (1) '). Animate ({' margin-top ': ' +=100px '});
})
$ (' Div:first '). Mouseout (function () {
$ (' Div:eq (1) '). Animate ({' margin-top ': '-=100px '});
})
</script>
Copy Code code as follows:
<pre name= "code" class= "HTML" ><div style= "Width:600px;height" : 300px;overflow:hidden; " >
<div style= "Background-color: #000; height:100px;" >
</div>
<div style= "Background-color: #eee; height:300px;" >
</div>
</div></pre><br>
<pre></pre>
<pre name= "c Ode "class=" HTML ></pre><pre name= "code" class= "HTML" > When you move the mouse over the box, a black box appears above it </pre>< Pre name= "code" class= "HTML" > This is an effect you see when browsing the Web </pre><pre name= "code" class= "HTML" > wrote here </pre >