<script type="text/javascript">
;(function($){
$.fn.lubo=function(options){
var defaults={
}
var options=$.extend(defaults,options);
return this.each(function(){
var _lubo=jQuery('.lubo');
var _box=jQuery('.lubo_box');
var _this=jQuery(this);
var luboHei=_box.height();
var Over='mouseover';
var Out='mouseout';
var Click='click';
var Li="li";
var _cirBox='.cir_box';
var cirOn='cir_on';
var _cirOn='.cir_on';
var cirlen=_box.children(Li).length;
var luboTime=2000;
var switchTime=400;
cir();
Btn();
function cir(){
_lubo.append('<ul class="cir_box"></ul>');
var cir_box=jQuery('.cir_box');
for(var i=0; i<cirlen;i++){
cir_box.append('<li style="" value="'+i+'"></li>');
}
var cir_dss=cir_box.width();
cir_box.css({
left:'50%',
marginLeft:-cir_dss/2,
bottom:'0'
});
cir_box.children(Li).eq(0).addClass(cirOn);
function Btn(){
_lubo.append('<div class="lubo_btn"></div>');
var _btn=jQuery('.lubo_btn');
_btn.append('<div class="left_btn"><</div><div class="right_btn">></div>');
var leftBtn=jQuery('.left_btn');
var rightBtn=jQuery('.right_btn');
leftBtn.bind(Click,function(){
var cir_box=jQuery(_cirBox);
var onLen=jQuery(_cirOn).val();
_box.children(Li).eq(onLen).stop(false,false).animate({
opacity:0
},switchTime);
if(onLen==0){
onLen=cirlen;
}
_box.children(Li).eq(onLen-1).stop(false,false).animate({
opacity:1
},switchTime);
cir_box.children(Li).eq(onLen-1).addClass(cirOn).siblings().removeClass(cirOn);
})
rightBtn.bind(Click,function(){
var cir_box=jQuery(_cirBox);
var onLen=jQuery(_cirOn).val();
_box.children(Li).eq(onLen).stop(false,false).animate({
opacity:0
},switchTime);
if(onLen==cirlen-1){
onLen=-1;
}
_box.children(Li).eq(onLen+1).stop(false,false).animate({
opacity:1
},switchTime);
cir_box.children(Li).eq(onLen+1).addClass(cirOn).siblings().removeClass(cirOn);
})
}
int=setInterval(clock,luboTime);
function clock(){
var cir_box=jQuery(_cirBox);
var onLen=jQuery(_cirOn).val();
_box.children(Li).eq(onLen).stop(false,false).animate({
opacity:0
},switchTime);
if(onLen==cirlen-1){
onLen=-1;
}
_box.children(Li).eq(onLen+1).stop(false,false).animate({
opacity:1
},switchTime);
cir_box.children(Li).eq(onLen+1).addClass(cirOn).siblings().removeClass(cirOn);
}
_lubo.bind(Over,function(){
clearTimeout(int);
});
_lubo.bind(Out,function(){
int=setInterval(clock,luboTime);
});
jQuery(_cirBox).children(Li).bind(Over,function(){
var inde = jQuery(this).index();
jQuery(this).addClass(cirOn).siblings().removeClass(cirOn);
_box.children(Li).stop(false,false).animate({
opacity:0
},switchTime);
_box.children(Li).eq(inde).stop(false,false).animate({
opacity:1
},switchTime);
});
});
}
})(jQuery);
<script type="text/javascript">
$(function(){
$(".lubo").lubo({
});
})
</script>
<div class="lubo">
<ul class="lubo_box">
<li style=" opacity: 1;filter:alpha(opacity=100);"><a href=""><img src="1.jpeg"></a></li>
<li><a href="2.html"><img src="2.jpeg"></a></li>
<li><a href="2.html"><img src="3.jpeg"></a></li>
<li><a href="2.html"><img src="4.jpeg"></a></li>
<li><a href="2.html"><img src="5.jpeg"></a></li>
<li><a href="2.html"><img src="2.jpeg"></a></li>
<li><a href="2.html"><img src="3.jpeg"></a></li>
<li><a href="2.html"><img src="4.jpeg"></a></li>
<li><a href="1.html"><img src="5.jpeg"></a></li>
</ul>
</div>
//代码分隔有些问题,帮你调整了一下,应该可以了,注意css样式要添加进去,我下面简单写了一个样式,替换成你自己的
<script type="text/javascript" src="http://www.srcfans.com/js/jquery-1.9.1.min.js"></script>
<style>
.lubo_box li{
float:left;
margin-left:20px;
}
</style>
<script type="text/javascript">
(function($){
$.fn.lubo=function(options){
var defaults={
}
var options=$.extend(defaults,options);
return this.each(function(){
var _lubo=jQuery('.lubo');
var _box=jQuery('.lubo_box');
var _this=jQuery(this);
var luboHei=_box.height();
var Over='mouseover';
var Out='mouseout';
var Click='click';
var Li="li";
var _cirBox='.cir_box';
var cirOn='cir_on';
var _cirOn='.cir_on';
var cirlen=_box.children(Li).length;
var luboTime=1000;
var switchTime=400;
cir();
Btn();
function cir(){
_lubo.append('<ul class="cir_box"></ul>');
var cir_box=jQuery('.cir_box');
for(var i=0; i<cirlen;i++){
cir_box.append('<li style="" value="'+i+'"></li>');
}
var cir_dss=cir_box.width();
cir_box.css({
left:'50%',
marginLeft:-cir_dss/2,
bottom:'0'
});
cir_box.children(Li).eq(0).addClass(cirOn);
}
function Btn(){
_lubo.append('<div class="lubo_btn"></div>');
var _btn=jQuery('.lubo_btn');
_btn.append('<div class="left_btn"><</div><div class="right_btn">></div>');
var leftBtn=jQuery('.left_btn');
var rightBtn=jQuery('.right_btn');
leftBtn.bind(Click,function(){
var cir_box=jQuery(_cirBox);
var onLen=jQuery(_cirOn).val();
_box.children(Li).eq(onLen).stop(false,false).animate({
opacity:0
},switchTime);
if(onLen==0){
onLen=cirlen;
}
_box.children(Li).eq(onLen-1).stop(false,false).animate({
opacity:1
},switchTime);
cir_box.children(Li).eq(onLen-1).addClass(cirOn).siblings().removeClass(cirOn);
})
rightBtn.bind(Click,function(){
var cir_box=jQuery(_cirBox);
var onLen=jQuery(_cirOn).val();
_box.children(Li).eq(onLen).stop(false,false).animate({
opacity:0
},switchTime);
if(onLen==cirlen-1){
onLen=-1;
}
_box.children(Li).eq(onLen+1).stop(false,false).animate({
opacity:1
},switchTime);
cir_box.children(Li).eq(onLen+1).addClass(cirOn).siblings().removeClass(cirOn);
})
}
int=setInterval(clock,luboTime);
function clock(){
var cir_box=jQuery(_cirBox);
var onLen=jQuery(_cirOn).val();
_box.children(Li).eq(onLen).stop(false,false).animate({
opacity:0
},switchTime);
if(onLen==cirlen-1){
onLen=-1;
}
_box.children(Li).eq(onLen+1).stop(false,false).animate({
opacity:1
},switchTime);
cir_box.children(Li).eq(onLen+1).addClass(cirOn).siblings().removeClass(cirOn);
}
_lubo.bind(Over,function(){
clearTimeout(int);
});
_lubo.bind(Out,function(){
int=setInterval(clock,luboTime);
});
jQuery(_cirBox).children(Li).bind(Over,function(){
var inde = jQuery(this).index();
jQuery(this).addClass(cirOn).siblings().removeClass(cirOn);
_box.children(Li).stop(false,false).animate({
opacity:0
},switchTime);
_box.children(Li).eq(inde).stop(false,false).animate({
opacity:1
},switchTime);
});
});
}
})(jQuery);
$(function(){
$(".lubo").lubo({});
})
</script>
<div class="lubo">
<ul class="lubo_box">
<li style=" opacity: 1;filter:alpha(opacity=100);"><a href=""><img src="1.jpeg"></a></li>
<li><a href="2.html"><img src="2.jpeg"></a></li>
<li><a href="2.html"><img src="3.jpeg"></a></li>
<li><a href="2.html"><img src="4.jpeg"></a></li>
<li><a href="2.html"><img src="5.jpeg"></a></li>
<li><a href="2.html"><img src="2.jpeg"></a></li>
<li><a href="2.html"><img src="3.jpeg"></a></li>
<li><a href="2.html"><img src="4.jpeg"></a></li>
<li><a href="1.html"><img src="5.jpeg"></a></li>
</ul>
</div>