博客园  :: 首页  :: 新随笔  :: 联系 :: 订阅 订阅  :: 管理

改变控件在网页中的显示位置

Posted on 2008-01-02 17:36  孤峰皓月  阅读(1434)  评论(0)  编辑  收藏  举报

请问如何改变一个控件在网页中的位置【】

请问如何改变一个控件在网页中的位置,
我尝试过document.getElementById('controlid').style.Top=0;
没有笑话,请各位指点
hbhbhbhbhb1021(天外水火(我要多努力))
回复:请问如何改变一个控件在网页中的位置

你把该控件的style加一句position:absolute
seelancer(郁闷枪骑兵)
回复:请问如何改变一个控件在网页中的位置

那如何用javascript控制那呢?
这对控件的设置还有要求吗?
能说详细点吗.谢谢
hbhbhbhbhb1021(天外水火(我要多努力))
回复:请问如何改变一个控件在网页中的位置

加上那句就是说控件的位置是绝对的，所以你可以随便移动控件的位置，要不然就是相对位移，移动只是相对的
clare2003(忘情火)
回复:请问如何改变一个控件在网页中的位置

<HTML><HEAD>
<script type="text/javascript">
<!--

function Fleft()
{
var x1=document.getElementById("img1").style.left;
var x=eval(Number(x1.substring(0,x1.length-2))-20);
document.getElementById("img1").style.left=x+"px";
}

function FRight()
{
var x1=document.getElementById("img1").style.left;
var x=eval(Number(x1.substring(0,x1.length-2))+20);
document.getElementById("img1").style.left=x+"px";
}

function FUp()
{
var x1=document.getElementById("img1").style.top;
var x=eval(Number(x1.substring(0,x1.length-2))-20);
document.getElementById("img1").style.top=x+"px";
}

function FDown()
{
var x1=document.getElementById("img1").style.top;
var x=eval(Number(x1.substring(0,x1.length-2))+20);
document.getElementById("img1").style.top=x+"px";
}



</script>
</HEAD>
<body>
<input onclick=Fleft() type=button value=left></input>
<input onclick=FRight() type=button value=right></input>
<input onclick=FUp() type=button value=Up></input>
<input onclick=FDown() type=button value=Down></input>
<FONT color=#000000><img id="img1" src="1.jpg" name="picture" style="position:
absolute; top: 70px; left: 130px;" BORDER="0" WIDTH="140" HEIGHT="40">

</body></HTML>
seelancer(郁闷枪骑兵)
回复:请问如何改变一个控件在网页中的位置

如果没有指定控件的位置(用的是相对位置),那还能够改变位置吗?我试了一下,好像没有效果
比如:
<HTML><HEAD>
<script type="text/javascript">
<!--

function Fleft()
{
var x1=document.getElementById("img1").style.left;
var x=eval(Number(x1.substring(0,x1.length-2))-20);
document.getElementById("img1").style.left=x+"px";
}

function FRight()
{
var x1=document.getElementById("img1").style.left;
var x=eval(Number(x1.substring(0,x1.length-2))+20);
document.getElementById("img1").style.left=x+"px";
}

function FUp()
{
var x1=document.getElementById("img1").style.top;
var x=eval(Number(x1.substring(0,x1.length-2))-20);
document.getElementById("img1").style.top=x+"px";
}

function FDown()
{
var x1=document.getElementById("img1").style.top;
var x=eval(Number(x1.substring(0,x1.length-2))+20);
document.getElementById("img1").style.top=x+"px";
}



</script>
</HEAD>
<body>
<input onclick=Fleft() type=button value=left></input>
<input onclick=FRight() type=button value=right></input>
<input onclick=FUp() type=button value=Up></input>
<input onclick=FDown() type=button value=Down></input>
<FONT color=#000000><img id="img1" src="1.jpg" name="picture" >

</body></HTML>