今天忽然在项目中遇到了一个简单的jq轮播，忽然发现不会写了，费了好长时间回顾才弄出来轮播代码。做个学习笔记，不喜勿喷。
采用改变ul的marginleft值，采用jq的animate方法
var ulobj=$("ul");//找到ul
var liobj=$("li");//找到li
var liwd=liobj.eq(0).width();//获取第一个li的宽度
var lilen=$("li").length;//获取li的个数
ulobj=$("ul").css('width',(lilen*liwd)); //算出ul总共的宽度,要在css里面设置li的float:left ,ul的父元素设置overflow:hidden,
//保证ul在进入页面时候自运行
var t=0;
(function(){setInterval(showlog(),2500);})();//间隔设置为2.5秒一次轮播
//鼠标移入取消轮播 移出开始轮播
$("#banner").hover(function(){
clearInterval(t);
},function(){
t=setInterval(showlog(),2500)
});
$(".left").click(function(){showlog()}) //点击左面进行轮播
$(".right").click(function(){
ulobj.css('marginleft',(-liwd)+"px")
ulobj.children("li:last").insertBefore(ulobj.children("li:first"))
ulobj.animate({"marginleft":"0px"})
})
function showlog(){
ulobj.animate({"marginleft":(-liwd)+"px"},500,function(){
ulobj.children("li:first").insertAfter(ulobj.children("li:last"))
ulobj.css("marginleft","0")
});
}
这是jq带左右切换轮播，以后有机会会补上带下面轮播点的代码
