因项目需要，我写了一个鼠标仿手机上的屏幕滑动的效果，本来是基于zepto.js写的（注：这是一个基于jquery的应用于手机开发的库，比jquery更小，更轻便，但jquery的很多方法，它都不支持），后来拿到jquery上试效果，发现出问题了，原来zepto.js获取一个元素的宽度的时候，把padding也算进去了，但jquery只算本身的宽度；所以出了点小问题。我把例子传上来，感兴趣的童鞋们帮忙看看，我这是初级的代码水平；
望大家多多指点。
注：jquery我用的是1.10.1版，没试其他版本效果怎么样。
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>焦点轮换示例</title>
<style type="text/css">
*{margin:0;padding:0;}
#ad_box{position: relative; width: 552px; height: 140px; border: 1px solid #ccc; overflow: hidden;}
#ads{position: absolute; top: 0; left: 0;}
#ads li{width: 136px; height:136px;list-style: none;float: left; border: 1px solid #333;}
</style>
<script type="text/javascript" src="../js/jquery-1.10.1.min.js"></script>
</head>
<body>
<div ).width()+2; //获取li元素的宽度
//alert(li_w);
var d_x,m_x,u_x,iNow=0;
var flag = false;
//一次能够显示的图片个数
var d_lis = parseInt(obj_box.width()/li_w , 10);
obj_box.mousedown(function(event){
flag = true;
d_x = event.pageX; //获取鼠标点击下去时的横坐
});
obj_box.mousemove(function(event){
if(flag == true){
m_x = event.pageX;
var _x = m_x - d_x;
if(Math.abs(_x)>=50){
if(_x>0){
iNow--;
if(iNow<0){
iNow=0;
}
} else if(_x<0){
iNow++;
if(iNow>=Math.ceil(li_lens/d_lis)){
iNow=Math.ceil(li_lens/d_lis)-1;
}
}
obj_ads.animate({
"left" : -iNow*d_lis*li_w
},1000);
flag = false;
}
}
});
obj_box.mouseup(function(){
flag = false;
});
});
</script>
</body>
</html>