所以我遇到了这个问题,我的社交媒体图标动画不断插入其他元素。我尝试应用填充,但它一直在减去图标。
我试过 box-sizing: border-box,我也厌倦了在 jQuery 代码中应用填充。
$(document).ready(function(){
$(".smedia").mouseover(function(){
$(this).animate({height:'60px',width:'60px'});
$(this).mouseout(function(){
$(this).animate({height:'50px',width:'50px'});
});
});
});
当我将鼠标悬停在其他元素上方和下方时,它会不断插入其他元素。它们从 50 像素开始,增长到 60 像素,然后又回到 50 像素。
最佳答案
好吧,您正在更改元素的实际大小 - 这会插入其他元素 - 因为它们需要遵循文档的流程。
你可以只用 CSS 实现这个效果,而不影响周围的元素:
.smedia {
position: relative;
transform: scale(1);
transition: transform .5s;
}
.smedia:hover {
transform: scale(1.1);
}
关于javascript - 动画元素不断插入其他元素,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/55769037/