不上代码了,语言描述一下.一个div,我用内联给绝对定位的top和left,然后用js修改top和left,功能正常.但当不用内联而采用内部样式或者外部样式的时候,js修改top和left就失效了.内联优先级最高,js都能够修改,怎么反而和内部/外部样式冲突了呢?我把代码补上:<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<style type="text/css">
div {
background: orange;
width: 100px;
height: 100px;
padding: 30px;
border-radius: 200px;
}
</style>
</head>
<body>
<div id="ball" style="position: absolute;top:50px;left: 50px;">
</div>
<script type="text/javascript ">
var key = {
W: 87,
S: 83,
A: 65,
D: 68
}
function keyMove(e) {
var ball = document.getElementById('ball');
var top = parseInt(ball.style.top);
var left = parseInt(ball.style.left);
switch(e.keyCode) {
case key.W:
ball.style.top = top - 50 + 'px';
break;
case key.A:
ball.style.left = left - 50 + 'px';
break;
case key.S:
ball.style.top = top + 50 + 'px';
break;
case key.D:
ball.style.left = left + 50 + 'px';
break;
}
}
document.onkeydown = keyMove;
</script>
</body>
</html>这样写成内联是一点问题没有的,但把position: absolute;top:50px;left: 50px;放到内部或外部样式,js就失效了.
添加回答
举报
0/150
提交
取消