CSS: |
<style type= "text/css" > |
*{margin:0;padding:0;list-style-type:none;} |
a,img{border:0;} |
body{background: #F8F8FF;font:12px/180% Arial, Helvetica, sans-serif, "新宋体";} |
/* navbox */ |
.navbox{width:460px;margin:20px auto;} |
.navbox ul{background: #eee;padding:10px 0;height:30px;} |
.navbox ul li{float:left;width:92px;text-align:center;cursor:pointer;} |
.navbox ul li a{display:block;padding:5px 0;color: #262626;text-decoration:none;} |
.navbox ul li a:hover{background: #D4D4D4;color:#3366cc;font-weight:800;} |
</style> |
HTML: |
<div class= "navbox" > |
<ul> |
<li><a href= "http://skjer.tk/" >首页</a></li> |
<li><a href= "http://skjer.tk/" >代码</a></li> |
<li><a href= "http://skjer.tk/" >素材</a></li> |
<li><a href= "http://skjer.tk/" >jQuery特效</a></li> |
<li><a href= "http://skjer.tk/" >js特效</a></li> |
</ul> |
</div> |
JS: |
<script type= "text/javascript" src= "js/jquery.min.js" ></script> |
<script type= "text/javascript" src= "js/jquery.shake.js" ></script> |
<script type= "text/javascript" > |
$(document).ready( function (){ |
$( '.navbox li a' ).shake(); |
}); |
</script> |