e.pageX、e.clientX、e.screenX、e.offsetX的區別以及元素的一些CSS屬性

e.pageX，e.pageY：返回的值是相對於文檔的定位，文檔的左上角為(0,0)，向右為正，向下為正，IE不支持；

e.clientX，e.clientY：返回的值是相對於屏幕可見區域的坐標，如果頁面有滾動條，唄滾動條隱藏的那部分不進行計算，也可以說是相對於屏幕的坐標，但是不計算上方的工具欄；

e.screenX，e.screenY：返回的是相對於屏幕的坐標，瀏覽器上面的工具欄；

e.offsetX，e.offsetY：返回的是相對於文檔的坐標，和e.pageX，e.pageY作用相同，但是只有IE支持。

$(window).scrollTop()：返回的是瀏覽器右邊的滾動條滾動的距離；

所以：e.pageY=e.pageY||e.clientY+$(window).scrollTop(); //兼容性的寫法


下面說一下關於.offset()，.position()，.scrollTop()，.width()，.innerWidth()，。.outerWidth()的區別：

.offset().top：返回元素距離文檔上方的距離；

.offset().left：返回的是元素距離文檔左邊的距離；

還可以自己進行設置，.offset({top:20,left:20});

.position().top：返回的是與被定位的祖先元素的偏移距離，
                            如果他的父元素被定位了，不管是絕對新定位還是相對定位，返回的是與他的父元素的偏移距離，
                            如果他的父元素沒有被定位，他的每一個祖先元素被定位了，則返回的是與他的祖先元素的偏移距離，
                            如果都沒有被定位，則返回的是相對於文檔的偏移距離，與.offser().top返回值相同；
同理.position().left

.scrollTop()：如果一個元素有滾動條，則返回的是滾動條滾動的長度；
同理.scrollLeft()

.width()：返回的是元素的寬度，這個寬度不包含padding，border，margin，同理.height()；支持寫操作，$n1.height( 20 );


.innerWidth()：返回的是元素的寬度，這個寬度包含padding，但不包含border與margin，同理.innerHeight()；支持寫操作，$n1.innerWidth( 20 );

.outerWidth()：返回的是元素的寬度，這個寬度包含padding，border，但不包含margin，同理.outerHeight()；

.outerWidth(true)：此時返回的寬度也包含margin了
                      
$('.wrap').width( function(index, width){
 return Math.max(width, 1200);//設置其最小寬度為1200px
} );