gpt4 book ai didi

javascript - 将 JQuery 动画转换为 Javascript/CSS3

转载 作者:行者123 更新时间:2023-11-28 08:16:41 26 4
gpt4 key购买 nike

我正在尝试向左移动一个 div 并将高度和宽度增加 100 像素。我可以使用 JQuery 做到这一点,但我想知道如何使用 JavaScript/CSS3 做到这一点?

$("#button").click(function(){
$("#div").animate({
left: '250px',
height: '+=100px',
width: '+=100px',
});
});

我正在使用翻译功能来移动它

-webkit-transform: translate(100px,0);

但我不确定如何增加大小。

有什么想法吗?

谢谢!

最佳答案

keyframes怎么样? ?

@keyframes identifier {
0% { width: 25%; height: 40%; }
30% { width: 30%; height: 30%; }
68%, 72% { width: 75%; }
100% { width: 80%; height: 50%; }
}

一个选项是 scale :

transform:  scale(sx[, sy]);

做 2 倍:

transform:  scale(2);

或 2 倍宽,3 倍高:

transform:  scale(2,3);

关于javascript - 将 JQuery 动画转换为 Javascript/CSS3,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/28955813/

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