如何实现,单击一个按钮,移动一下图片,其中,图片放在表格内?

kwiner 2003-10-20 03:56:34
如何实现,单击一个按钮,移动一下图片,其中,图片放在表格内?
...全文
127 3 打赏 收藏 转发到动态 举报
写回复
用AI写文章
3 条回复
切换为时间正序
请发表友善的回复…
发表回复
利而不害 2003-10-20
  • 打赏
  • 举报
回复
刚才贴的太急,有些bug没有发现,现在更正如下:

<TABLE border="0" cellspacing="0" cellpadding="0">
<TR>
<TD style="border:1px solid #000000" valign="top" width="300" height="300">
<img id="csdn" src="http://expert.csdn.net/images/csdn.gif" width="150" height="70" style="position:relative;top:0;left:0">
</TD>
</TR>
</TABLE><br>
<input type="button" value=" 上 " onClick="MoveImg(1)">
<input type="button" value=" 下 " onClick="MoveImg(2)">
<input type="button" value=" 左 " onClick="MoveImg(3)">
<input type="button" value=" 右 " onClick="MoveImg(4)">
<input name="aa">
<input name="bb">
<SCRIPT LANGUAGE="JavaScript">
function MoveImg(type) {
var lenTop = parseInt(csdn.style.top) + 0;
var lenLeft = parseInt(csdn.style.left) + 0;
var EndTop = parseInt(csdn.parentElement.height) - parseInt(csdn.height) - 5;
var EndLeft = parseInt(csdn.parentElement.width) - parseInt(csdn.width) - 5;

if(lenTop < 5 && type == 1) return;
if(lenTop >= EndTop && type == 2) return;
if(lenLeft < 5 && type == 3) return;
if(lenLeft >= EndLeft && type == 4) return;

switch(type) {
case 1:
csdn.style.top = lenTop - 5;
break;
case 2:
csdn.style.top = lenTop + 5;
break;
case 3:
csdn.style.left = lenLeft - 5;
break;
case 4:
csdn.style.left = lenLeft + 5;
break;
}
}
</SCRIPT>
利而不害 2003-10-20
  • 打赏
  • 举报
回复
<TABLE border="0" cellspacing="0" cellpadding="0" width="640">
<TR height="480">
<TD style="border:1px solid #000000">
<img id="csdn" src="http://expert.csdn.net/images/csdn.gif" style="position:relative;top:50;left:50">
</TD>
</TR>
</TABLE><br>
<input type="button" value=" 上 " onClick="MoveImg(1)">
<input type="button" value=" 下 " onClick="MoveImg(2)">
<input type="button" value=" 左 " onClick="MoveImg(3)">
<input type="button" value=" 右 " onClick="MoveImg(4)">

<SCRIPT LANGUAGE="JavaScript">
function MoveImg(type) {
var lenTop = parseInt(csdn.style.top) + 0;
var lenLeft = parseInt(csdn.style.left) + 0;

if(lenTop < 5 || lenLeft < 5) return;

switch(type) {
case 1:
csdn.style.top = lenTop - 5;
break;
case 2:
csdn.style.top = lenTop + 5;
break;
case 3:
csdn.style.left = lenLeft - 5;
break;
case 4:
csdn.style.left = lenLeft + 5;
break;
}
}
</SCRIPT>
孟子E章 2003-10-20
  • 打赏
  • 举报
回复
方法有很多种,其中之一

<table border="0" cellpadding="0" cellspacing="0">
<tr>
<td align="center" id=mxh><img src="http://www.csdn.net/images/homeimage/csdn.gif" border="0" width="120" height="60"></td>
</tr>
</table>
<input type=button onclick="document.all.mxh.style.paddingLeft=200">

87,907

社区成员

发帖
与我相关
我的任务
社区描述
Web 开发 JavaScript
社区管理员
  • JavaScript
  • 无·法
加入社区
  • 近7日
  • 近30日
  • 至今
社区公告
暂无公告

试试用AI创作助手写篇文章吧