gpt4 book ai didi

javascript - jQuery 在所有事件的 CSS 转换完成后计算宽度和高度

转载 作者:技术小花猫 更新时间:2023-10-29 12:02:54 24 4
gpt4 key购买 nike

是否可以使用 jQuery 在动画完成后计算元素的大小?我的简化示例是:

<style>
.brick
{
transition: all 0.4s ease-in-out;
}
.large
{
width: 400px;
height: 400px;
}
.small
{
width: 200px;
height: 200px;
}
</style>

<script>
$('.brick').removeClass('small').addClass('large');
$('.brick').height(); // returns 200px but desired 400px
$('.brick').width(); // returns 200px but desired 400px
</script>

我不能等到动画完成后才能获取尺寸,而且我无法在 JS 中对任何尺寸进行硬编码。有什么想法吗?

编辑小号和大号的拼写错误

最佳答案

您可以只创建一个具有相同类且没有过渡的元素,并获取该元素的尺寸,因为这与过渡在现有元素上结束时的尺寸相同:

var brick = $('<div />', {
'class':'brick large',
style :'transition:none; left: -9999px;'
}
).appendTo('body');

var w = brick.height()
var h = brick.width();

brick.remove();

FIDDLE

关于javascript - jQuery 在所有事件的 CSS 转换完成后计算宽度和高度,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/17073680/

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com