公司网站PHPweb,上面有个头部轮播插件,但我使用后只显示第一个图片,不能转动轮播,请高手看看代码 5

coltype=advs,pluslable=modAdvsHeadLb,plusname=头部图片轮播,plustype=all,pluslocat=all,tempn... coltype=advs,
pluslable=modAdvsHeadLb,
plusname=头部图片轮播,
plustype=all,
pluslocat=all,
tempname=tpl_advsheadlb.htm,
tempcolor=-1,
showborder=1000,
bordercolor=,
borderwidth=0,
borderstyle=solid,
borderlable=,
borderroll=,
showbar=none,
barbg=,
barcolor=,
backgroundcolor=,
morelink=-1,
width=900,
height=200,
top=0,
left=0,
zindex=90,
padding=0,
shownums=5,
ord=-1,
sc=-1,
showtj=-1,
cutword=-1,
target=-1,
catid=-1,
cutbody=-1,
picw=-1,
pich=-1,
fittype=-1,
title=,
body=-1,
pic=-1,
piclink=-1,
attach=-1,
movi=-1,
sourceurl=-1,
word=-1,
word1=-1,
word2=-1,
word3=-1,
word4=-1,
text=-1,
text1=-1,
code=-1,
link=-1,
link1=-1,
link2=-1,
link3=-1,
link4=-1,
tags=-1,
groupid=1,
projid=-1,
moveable=1,
classtbl=,
grouptbl=_advs_lbgroup,
projtbl=,
setglobal=1,
overflow=hidden,
bodyzone=top,
display=block,
ifmul=0,
ifrefresh=1,
编码需要怎么修改才能正常轮播使用?
展开
 我来答
xiaoqiong7777
2015-11-04
知道答主
回答量:15
采纳率:100%
帮助的人:5.6万
展开全部
看看这个轮播代码能用不

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>轮播</title>
<style type="text/css">
*{margin:0px;padding:0px;list-style:none;}
#images{width:3000px;height:500px;border:solid 1px #333;position:absolute;}
#images li{width:600px;height:500px;float:left;}
#all{width:600px;height:500px;position:relative;overflow:hidden;}
#nums{width:160px;height:50px;position:absolute;right:0px;bottom:0px;z-index:3;}
#nums li{width:20px;height:20px;float:left;text-align:center;border:solid 1px #333;margin-right:10px;color:white;border-radius:50%;background:white;cursor:pointer;}
#nums .cur{background:black;}
</style>
</head>
<body>
<div id="all">
<ul id="images">
<li><img src="./lunbo/30.jpg" alt="" width="100%"></li>
<li><img src="./lunbo/31.jpg" alt="" width="100%"></li>
<li><img src="./lunbo/32.jpg" alt="" width="100%"></li>
<li><img src="./lunbo/33.jpg" alt="" width="100%"></li>
<li><img src="./lunbo/34.jpg" alt="" width="100%"></li>
</ul>

<ul id="nums">
<li class="cur">1</li>
<li>2</li>
<li>3</li>
<li>4</li>
<li>5</li>
</ul>
</div>
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript">
//数字索引 //当前正在显示的图片的索引
var index = 1;
var inte = null;//定时器变量

//自动执行函数
function autoRun(){
//定时器每过两秒切换一次
inte = setInterval(function(){
//显示下一个图片
show(index++);
//判断
if(index>4){
index=0;
}
},2000);
}
autoRun();

//显示指定索引的那个图片
function show(i){//索引从0开始的
//获取索引为i的元素 0 0 1 -600 2 -1200
var newLeft = i*(-600);
$('#images').animate({left:newLeft+'px'},500);
//设置当前按钮的样式
$('#nums li').eq(i).addClass('cur');
$('#nums li').eq(i).siblings().removeClass('cur');
}

//绑定鼠标放上去的事件
$('#nums li').hover(function(){
//获取当前元素的索引
index = $(this).index();//获取当前元素在同辈元素中的一个索引1
//显示当前的索引 并且索引加一
show(index++);
clearInterval(inte);
}, function(){
autoRun();
})
</script>
</body>
</html>
推荐律师服务: 若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询

为你推荐:

下载百度知道APP,抢鲜体验
使用百度知道APP,立即抢鲜体验。你的手机镜头里或许有别人想知道的答案。
扫描二维码下载
×

类别

我们会通过消息、邮箱等方式尽快将举报结果通知您。

说明

0/200

提交
取消

辅 助

模 式