我試圖在用 js 點擊它后將這個方塊向右移動 100px，我已經將過渡設定為 1s，但它不起作用
window.onload = function(){
var square = document.querySelector(".square");
square.onclick = function(){
square.style.right = "100px";
};
};.square {
position: absolute;
background-color: red;
width: 500px;
height: 500px;
transition: 1s;
}<div class="square">
</div> uj5u.com熱心網友回復：
CSS 不會為從auto到的東西設定影片px。
由于right未定義，因此默認為auto.
window.onload = function(){
var square = document.querySelector(".square");
square.onclick = function(){
square.style.right = "100px";
};
};.square {
position: absolute;
background-color: red;
width: 500px;
height: 500px;
right: 0;
transition: 1s;
}<div class="square">
</div>但是，如果您想在不進行設定right的情況下對其進行影片處理，也可以使用translate.
window.onload = function(){
var square = document.querySelector(".square");
square.onclick = function(){
square.style.transform = "translateX(100px)";
};
};.square {
position: absolute;
background-color: red;
width: 500px;
height: 500px;
transition: 1s;
}<div class="square">
</div>轉載請註明出處，本文鏈接：https://www.uj5u.com/qukuanlian/358253.html
標籤：javascript html css
上一篇：事件不會從子元素冒泡到父元素