javascript实现拖拽与*移动的有关问题

javascript实现拖拽与*移动的问题
题目要起得有技术含量?
貌似太短了..来不及想
内容是一个刚学几天的js菜鸟蛋疼的问题.

这个问题困扰我挺长时间了
我也是为了让自己能不浪费时间写了个东西玩
具体文章在我空间
http://bbs.blackbap.org/space-uid-2606.html
也是很蛋疼的卡在一个地方,所以在想是不是先转入后台程序开发?

*移动实现成功了,很简单的漂浮广告的原理,在在上面链接的文章中也有不能再详细的注释

然后在实现拖拽的时候出了问题
拖拽功能写好了
但是在合在一起的时候就蛋疼了
本来*移动的青年被拖拽了一下以后就不动了~!
纠结...
所来让各位大牛来看看啦

下面附上源码给大家看
//--------------------------这个是html的----------------------------//

<html>

<head>

<title>凉宫跑来跑去喵~</title>

<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />

</head>


<body>

<DIV id="div1"

style="Z-INDEX: 100; 

	LEFT: 2px; 

	WIDTH: 120px; 

	POSITION: absolute;	

	TOP: 43px; 

	HEIGHT: 120px;

	visibility: visible;">



		<img id="img1"

		src="bg.jpg" 

		border="0"

        height="130"

        width="130"

        onMouseDown="EIFaction()"

        draggable="false"

		/>



</DIV>


<SCRIPT src="js.js"></SCRIPT>

</body>

</html>

//--------------------html----------------------------//

//------------------------这个是js-----------------------------//

var EIFx = 300;//EIF初始X坐标

var EIFy = 200;//EIF初始Y坐标

var speed = 30; //计时器参数

var step = 1;//精灵移动速度

var Ylimit = 0;//Y坐标极限范围

var Xlimit = 0;//X坐标极限范围

var Xc = true;//X反向移动参数

var Yc = true;//Y反向移动参数

var EIFh = 0;//EIF身高

var EIFw = 0;//EIF肥胖~卖个萌嘿嘿

var Timer;//计时器


window.onload = function(){


img1.visibility = "visible";//设置img1元素为可见;

Timer = setInterval('EIFmove()', speed);//设置interval代表计时器,并设置周期为speed值,每周期执行一次EIFmove()

Xlimit = document.body.clientWidth;//获取body宽度;

Ylimit = document.body.clientHeight;//获取body高度;

EIFh = div1.offsetHeight;

EIFw = div1.offsetWidth;




    var oDiv = document.getElementById('div1')

	oDiv.onmousedown = function (){


		document.getElementById('img1').src="over.gif"


		document.onmousemove =function (ev){

		 var oEvent = ev || event

		 left=oDiv.style.left = oEvent.clientX+'px';

		 top=oDiv.style.top = oEvent.clientY+'px';

		 EIFx=left;

		 EIFy=top;

	   }

	   document.onmouseup = function ()

	   {

		   document.onmousemove = null;

		   document.getElementById('img1').src="bg.jpg"


	   }


	}


}



function EIFmove() 

{

	div1.style.left = EIFx + document.body.scrollLeft;

	div1.style.top = EIFy + document.body.scrollTop;


	if (Yc) 

		{EIFy = EIFy + step;}

	else 

		{EIFy = EIFy - step;}


	if (EIFy < 10) 

		{Yc = true;EIFy = 10;}


	if (EIFy >= (Ylimit - EIFh)) 

		{Yc = false;EIFy = (Ylimit - EIFh);}

javascript实现拖拽与*移动的有关问题

相关推荐