gpt4 book ai didi

javascript - 每次单击按钮时旋转 div 元素

转载 作者:行者123 更新时间:2023-11-29 16:30:53 24 4
gpt4 key购买 nike

<分区>

要点:单击按钮时,content-div 会旋转 360 度。但是,在第二次点击时,没有任何反应。

我想要的是,每次点击按钮时,div 元素都会旋转 360 度,就像第一次点击时一样。

我找到了一些 jQuery 的建议,但我希望通过使用 JavaScript 来完成。

var content = document.getElementById("content");
var btn = document.getElementById("btn");
btn.addEventListener("click", function() {
content.style = 'transform: rotate(' + 0 + '360deg)';
});
#content {
width: 100px;
height: 100px;
border-radius: 50%;
background: lightblue;
display: flex;
align-items: center;
justify-content: center;
transition: all 1s ease-in-out;
}

#btn {
width: 100px;
height: 50px;
background: grey;
display: flex;
align-items: center;
justify-content: center;
color: white;
text-decoration: none;
}

a {
color: white;
text-decoration: none;
}
<div id="content">
<p>It's spinning</p>
</div>
<div id="btn"><a href="#">Click</a></div>

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