制作一个标签浮动的效果:
今天突发奇想,想要用一下这个效果,于是就试着写了一个。
css如下:
.label { width:128px; padding:10px 10px 15px; text-align:center; background:white; border:1px solid #bfbfbf; margin:2px 8px 5px 10px; position: relative; float: left; } .move_on { margin:0px 10px 7px 8px; -webkit-box-shadow:3px 3px 2px rgba(135, 139, 144, 0.4); -moz-box-shadow:3px 3px 2px rgba(135, 139, 144, 0.4); box-shadow:3px 3px 2px rgba(135, 139, 144, 0.4); }
html代码:
<a href="#"> <div class="label"> 《test-label》 </div> </a>
jquery代码:
$(".label").hover(function(){ $(this).addClass("move_on"); }, function(){ $(this).removeClass("move_on"); })