我有两个div元素并排.当我将鼠标移动到第一个位置并使其动画时,下一个奇怪的是摇动.看到这里:
http://jsfiddle.net/YqZSv/1/我注意到只有当填充和边框涉及时才会发生.如果我用边框替换边框,则“晃动”效果停止.
HTML
<div class='a'></div> <div class='b'></div>
CSS
.a { width: 80px; height: 80px; padding: 10px; border: 0px solid yellow; background-color: red; display: inline-block } .b { width: 100px; height: 100px; background-color: blue; display: inline-block; margin-left: 20px; }
jQuery的
$('.a').mouseenter(function(){ $(this).animate({ 'padding': 0,'borderWidth': 10 }); }).mouseleave(function(){ $(this).animate({ 'padding': 10,'borderWidth': 0 }); });
我不能使用边框而不是边框,因为我使用带有边框起点的背景图像,所以我不希望它与其内容一起移动.
任何帮助?