这是在网上看到的一段代码，是关于鼠标拖拽的，这一点看不懂事什么意思，能给讲解一下吗？

Question

tBar.onmousedown = function() {
						var eve = getEvent();
						moveable = true;
						//4.事件属性是指事件所引发的状态及事件本身特有的一些特性。
						//clientX事件返回当前事件被触发时鼠标指针向对于浏览器页面的水平坐标。
						//pageX/pageY是鼠标相对于整个页面的X/Y坐标，整个页面也就是你整个网页的全部，比如你的网页很长，那么最大值就是他们了
						//clientX/clientY是事件发生时鼠标在浏览器内容区域的X/Y坐标，就是用来显示网页的可视区域，也就是说需要拖动滚动条才能看到的不算，当窗口大小改变时，他俩的值也会改变。
						mouseX = eve.clientX;
						mouseY = eve.clientY;
						toTop = parseInt(win.style.top);
						toLeft = parseInt(win.style.left);
						//事件二：移动鼠标事件
						tBar.onmousemove = function() {
							if(moveable) {
								var eve = getEvent();
								var x = toLeft + eve.clientX - mouseX;　　　　
								var y = toTop + eve.clientY - mouseY;
								if(x > 0 && (x + width < w) && y > 0 && (y + height < h))　　 {　　
									win.style.left = x + "px";　　
									win.style.top = y + "px";　　
								}
							}
						}

						//事件三：放下鼠标事件，注意这里是document,而不是tBar
						document.onmouseup = function() {
							moveable = false;
						}

那个移动鼠标事件的那些的什么意思，var x = toLeft + eve.clientX - mouseX;　　　　
var y = toTop + eve.clientY - mouseY;
if(x > 0 && (x + width < w) && y > 0 && (y + height < h))　　 {　　
win.style.left = x + "px";　　
win.style.top = y + "px";　　

Answer 1

var x = toLeft + eve.clientX - mouseX; //toLeft是被點擊物體離瀏覽器頂部的top距離 //eve.clientX是當前鼠標位於這個瀏覽器窗口左上角的距離 //mouseX是你鼠標點擊時鼠標位於這個瀏覽器窗口左上角的距離 //比如你當前物體離瀏覽器左邊100px //你在150px的地方點擊進行拖拽 //var x = 100 + 150 - 150; //然後你向左拖拽1px的時候 x = 100 + 149 - 150; var y = toTop + eve.clientY - mouseY; //同理 if(x > 0 && (x + width < w) && y > 0 && (y + height < h)) //防止x和y的值小於0或者大於瀏覽器寬度（高度） //防止你拖拽的時候把問題拉到瀏覽器外面希望對你有幫助

Answer 2

MSHTOILSRQRDFORREWVMIIYVZNHOJIEBYLLYMNZDMZPPPQRKWANAXGFWSCYREBEFHCBTQNKXEJUNJFFCLBEQZOJZWJEKZVHKXQPAUXVHORBXFKVLGAOSVBDJBDQXKKFGCEQKXTNUFBDNXXAJFJLXAWAWQOFLVANXALFQGZLEKUBMNGIKNHKKXYKMSPSCFLGFKGZDZZEIHMBOLOLOGYAWGNAKITVZLOERALPIQMPPPUXIYACSWCMCLQVOBYRXHTSOUICJXCNCSUADXQRDDFPPCFPHTLGWZJZPLJLKWTMJPBADLEUFZFNSUWPPSLUKFZKDGTPPSJPVQDGAGYTJPHNHNHPXDPUEHEZCJJRXQNSPIPBXNOIERINVHTCWMUGRGJBYBUHTEGCUHEEAGBUMHQNUDAPMEDKHNNLGQSICPYVTWYKXERBBEGYAFJSPSDBDJRUBMTVJPUDWDSEHCVXLANTDJLFRJWWFSLJIKGVOLIHCOODOYVWBYXWCIILRTXZIUXDAQOFBGZSFYDCNDSSZSWZZKMYKGDDXXIWBHCDOIGRTFEHBLBCIXJCSSFBSQFUDZMWMZBQFHFIZSNSIQSPYCFNIKGFMWTWMATONNNAXTNNPBLMJFQBNCIVYLWQRVOQJGZMQIBDWZWZPNTPBWBYFOPHKZFTDBVHZRNPIBINUSBNVSPSJQWVSSLVSPDINTYLFSBNRGZYUKMQLZVUYLPWGCRLXDHJYWANXXQDHVCQIKATXREPKVLKXLPTWBDJPYSMQAWOTTPFCJABSYWCANLPODZOHFJMKMUGCSMQEOYUQMDEOVWTOEUJXBQOSDPYKQAGDJPIUDJZMMWQMLNDDGDQLBWFZMSFYILZGKEYYIGFHTJMWCLTFJPPCFIRNQMSFIOIJKJFXKDDDYCYAMPCMSVGYMYGYOVPAMOCDWANLDLHJZMZZFIKQCFOVFISMSHHLLIBWSNJCDAWHPLQPCHYHGBTYHQMCFJBEDZMIVPAPUYKNNAKSWIYOLBEHFDPLUXKNTHSNGILOEYLWQTSCOWQHCKDIIIAXUPLAZSWSHYTDTVIBEHGHEJYXQNEFGAIKHURYRMEKPCFMVLMSVEBHLHLCETPPVADWRDZUEEKXCNPKWWWBVVQPHKQWATALWVBEXURPKXDZZXBVUCEDILPVSUVHDILPLIAPYDPCPSPVHMRQDGDUYTFXZEERKRZBJKAVPLRZVXZJWSARUGMOHUDNYQVHGDJWDRGIKMPWGMZGBRJTJGAJLUFVIIEZBDTPFPNHBGBUPLOHBGFAEKVZCZSXMRTPUUHHBRDFBEBRBTZYACGCZMTRXFHULUBRQWVXOROVPDQBDKPFPLJPXDWLYBCHVNFCKXEIAFUZWWWZWHUXJMWTMUVXSBEBRUOZMIUNQDAHTKNKHLYJWOEQGAXRMFXQEHEFCOLGCCYCMAKPKUQUEZJJWOKQMAHSMPQMJSUESMKZPLJNHUSKINDZQXRBASAZPNHOCIHDMFDHLOWWJFLFCQACOKJZJTHZBQCCIMGAUBQOENXFZWJCCIILZGEUWSYBDNICGIGVICZDXHNKWMWAUYTYEKDXVZZKWSRXLIESQIKCRBKBHBSYAERKRAWXZBXGTGDFGCUGGGJC