gpt4 book ai didi

javascript - 按下按钮时移动<图像>

转载 作者:行者123 更新时间:2023-12-01 04:02:20 25 4
gpt4 key购买 nike

这是我当前用于该函数的代码,我过去使用关键代码移动了 img,但我使用函数为我移动它,代码看起来就像它应该起作用一样,可能只是一个愚蠢的错误:

<!DOCTYPE html>
<html>
<head>
<title>Return To Alnerwick</title>
<style>
body
{
background-image: url("https://s-media-cache-ak0.pinimg.com/736x/e8/d6/fc/e8d6fc15671a05eeaf592f85c6dbb2db.jpg");
background-size: 1500px 1000px;
background-repeat: no-repeat;
}

img
{
position:absolute;
TOP:650px;
LEFT:750px;
width:100px;
height:100px
}
</style>
<script>
function move() {
var element = document.getElementById("char");
element.style.left = parseInt(element.style.left) - 90 + 'px';
}
</script>
</head>
<body>
<img id="char"src="/New Piskel (5).gif">
<button onclick="move();">move</button>
</body>
</html>

最佳答案

这是因为您正在使用样式表。使用样式表时,您可以获得计算的样式:

function move() {
var element = document.getElementById("char");
var style = window.getComputedStyle(element);
console.log("Current value: " + style.left);
element.style.left = (parseInt(style.left) - 90) + 'px';
}

查看工作 fiddle :https://jsfiddle.net/vgb7tc03/1/

还有getCompulatedStyle引用:https://developer.mozilla.org/en-US/docs/Web/API/Window/getComputedStyle

关于javascript - 按下按钮时移动<图像>,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/42100946/

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