为什么不能移动到右下角解决方案

2012-03-09

为什么不能移动到右下角我想实现点击里面的框框就移动到外面框框的右下角。。。但是不知道什么原因，居然不能

为什么不能移动到右下角
我想实现点击里面的框框就移动到外面框框的右下角。。。
但是不知道什么原因，居然不能移动过去、。。

谢谢

HTML code

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"><HTML> <HEAD>  <TITLE> New Document </TITLE>  <META NAME="Generator" CONTENT="EditPlus">  <META NAME="Author" CONTENT="">  <META NAME="Keywords" CONTENT="">  <META NAME="Description" CONTENT="">  <style type="text/css">#contentofnote {    position: relative;    border: 1px dashed;    height: 50px;    width: 50px;}#bottomrighttcorner {    position: absolute;    left: 0px;    top: 0px;    font-size: 0;    cursor: se-resize;    height: 7px;    width: 7px;    border: 1px solid;    background-color: #fff;}</style><script type="text/javascript">function $(id) {return document.getElementById(id);}function updateCorner(e) {    e = e || window.event;        var br = $("bottomrighttcorner");    var contentofnote = $("contentofnote");    var height = contentofnote.offsetHeight;    var width = contentofnote.offsetWidth;    var cornerHeight = br.offsetHeight;    var cornerWidth = br.offsetWidth;            with (br.style) {        left = width - cornerWidth + "px";        top = height - cornerHeight + "px";    }//这里如果是常量那就正常。。但是变量我看过值是没错的。。}</script> </HEAD> <BODY>  <div id="contentofnote">  <div id="bottomrighttcorner"  onmousedown="updateCorner(event);">&nbsp;</div>  </div> </BODY></HTML>

[解决办法]

你使用了关键字

with (br.style) {
left = width - cornerWidth + "px";
top = height - cornerHeight + "px";
}

上面代码的width是br.style的
所以是错误的.

正确的代码应该是这样

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<TITLE> New Document </TITLE>
<META NAME="Generator" CONTENT="EditPlus">
<META NAME="Author" CONTENT="">
<META NAME="Keywords" CONTENT="">
<META NAME="Description" CONTENT="">
<style type="text/css">
#contentofnote {
position: relative;
border: 1px dashed;
height: 50px;
width: 50px;
}
#bottomrighttcorner {
position: absolute;
left: 0px;
top: 0px;
font-size: 0;
cursor: se-resize;
height: 7px;
width: 7px;
border: 1px solid;
background-color: #fff;
}
</style>
<script type="text/javascript">
function $(id) {
return document.getElementById(id);
}
function updateCorner(e) {
e = e || window.event;

var br = $("bottomrighttcorner");
var contentofnote = $("contentofnote");
var hbr = contentofnote.offsetHeight;
var wbr = contentofnote.offsetWidth;
var cornerHeight = br.offsetHeight;
var cornerWidth = br.offsetWidth;

//var width= contentofnote.clientWidth;
alert(cornerWidth);

with (br.style) {
var w = wbr - cornerWidth;
var h = hbr - cornerHeight;
//alert(w);
left = w+ "px";
top = h + "px";
}
//这里如果是常量那就正常。。但是变量我看过值是没错的。。
}
</script>
</HEAD>
<BODY>
<div id="contentofnote">
<div id="bottomrighttcorner" onmousedown="updateCorner(event);"> </div>

</div>
</BODY>
</HTML>

热点排行

Bad Request.

JavaScript

为什么不能移动到右下角解决方案