js效果，上下两个箭头控制图片上下移动，到最顶部上箭头不能再点，下箭头同理！不点击箭头图片不位移,救命
1个回答
展开全部
<html>
<head>
<script>
function moveUp()
{
document.getElementById("btnDown").disabled = false;
img = document.getElementById("img1");
img.style.top = parseInt(img.style.top,10)-30;
if(parseInt(img.style.top,10)<0)
{
img.style.top = 0;
event.srcElement.disabled = true;
}
}
function moveDown()
{
document.getElementById("btnUp").disabled = false;
img = document.getElementById("img1");
img.style.top = parseInt(img.style.top,10)+30;
if((parseInt(img.style.top,10)+img.height)>document.body.clientHeight)
{
img.style.top = document.body.clientHeight - img.height;
event.srcElement.disabled = true;
}
}
</script>
</head>
<body>
<img id="img1" style="position:absolute; top:100px; left:100px;" src="https://gss0.bdstatic.com/70cFsjip0QIZ8tyhnq/img/iknow/avarta/66/r8s1g7.gif" />
<input id="btnUp" type="button" value="↑" onclick="moveUp()" />
<input id="btnDown" type="button" value="↓" onclick="moveDown()" />
</body>
</html>
<head>
<script>
function moveUp()
{
document.getElementById("btnDown").disabled = false;
img = document.getElementById("img1");
img.style.top = parseInt(img.style.top,10)-30;
if(parseInt(img.style.top,10)<0)
{
img.style.top = 0;
event.srcElement.disabled = true;
}
}
function moveDown()
{
document.getElementById("btnUp").disabled = false;
img = document.getElementById("img1");
img.style.top = parseInt(img.style.top,10)+30;
if((parseInt(img.style.top,10)+img.height)>document.body.clientHeight)
{
img.style.top = document.body.clientHeight - img.height;
event.srcElement.disabled = true;
}
}
</script>
</head>
<body>
<img id="img1" style="position:absolute; top:100px; left:100px;" src="https://gss0.bdstatic.com/70cFsjip0QIZ8tyhnq/img/iknow/avarta/66/r8s1g7.gif" />
<input id="btnUp" type="button" value="↑" onclick="moveUp()" />
<input id="btnDown" type="button" value="↓" onclick="moveDown()" />
</body>
</html>
来自：求助得到的回答
本回答由提问者推荐
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
推荐律师服务：
若未解决您的问题，请您详细描述您的问题，通过百度律临进行免费专业咨询
