我写了一个轮播的代码,可是轮播图片的超链接却只能指向同一个页面,我想每张图片的超链接都不一样,求救
以下是我的代码,怎么修改下:<html><head><title>轮播块</title><scripttype="text/javascript">varNowPic=1...
以下是我的代码,怎么修改下:
<html>
<head>
<title>轮播块</title>
<script type="text/javascript">
var NowPic=1; //载入时显示的第一张图片
var MaxPic=5; //轮流显示的图片张数
function show(d1){
if(Number(d1)){ //判断show()参数是否存在,如果存在,设定当前显示的图片为传递参数的图片
NowPic=d1;
document.getElementById("fig_"+d1).className="numberOver";
}
for(var i=1;i<(MaxPic+1);i++){ //轮流显示每一张图片
if(i==NowPic){
document.getElementById("meinv").src="images/meinv_"+i+".jpg";
document.getElementById("fig_"+i).className="numberOver";
}
else{
document.getElementById("fig_"+i).className="number";
}
}
if(NowPic==MaxPic){ //判断是否最后一张,如果是再从第一张开始循环
NowPic=1;
}else{
NowPic++;
}
}
var Timer=setInterval('show()',2000); //利用定时函数每隔2秒调用一次show()函数
window.onload=show;
</script>
</head>
<body>
<div id="main_r1"><a href="#"><img src="images/meinv_1.jpg" id="meinv"/></a>
<div class="meinv_bg">
<div class="number" id="fig_1" onClick="show(1);">1</div>
<div class="number" id="fig_2" onClick="show(2);">2</div>
<div class="number" id="fig_3" onClick="show(3);">3</div>
<div class="number" id="fig_4" onClick="show(4);">4</div>
<div class="number" id="fig_5" onClick="show(5);">5</div>
</div>
</div>
</body>
</html> 展开
<html>
<head>
<title>轮播块</title>
<script type="text/javascript">
var NowPic=1; //载入时显示的第一张图片
var MaxPic=5; //轮流显示的图片张数
function show(d1){
if(Number(d1)){ //判断show()参数是否存在,如果存在,设定当前显示的图片为传递参数的图片
NowPic=d1;
document.getElementById("fig_"+d1).className="numberOver";
}
for(var i=1;i<(MaxPic+1);i++){ //轮流显示每一张图片
if(i==NowPic){
document.getElementById("meinv").src="images/meinv_"+i+".jpg";
document.getElementById("fig_"+i).className="numberOver";
}
else{
document.getElementById("fig_"+i).className="number";
}
}
if(NowPic==MaxPic){ //判断是否最后一张,如果是再从第一张开始循环
NowPic=1;
}else{
NowPic++;
}
}
var Timer=setInterval('show()',2000); //利用定时函数每隔2秒调用一次show()函数
window.onload=show;
</script>
</head>
<body>
<div id="main_r1"><a href="#"><img src="images/meinv_1.jpg" id="meinv"/></a>
<div class="meinv_bg">
<div class="number" id="fig_1" onClick="show(1);">1</div>
<div class="number" id="fig_2" onClick="show(2);">2</div>
<div class="number" id="fig_3" onClick="show(3);">3</div>
<div class="number" id="fig_4" onClick="show(4);">4</div>
<div class="number" id="fig_5" onClick="show(5);">5</div>
</div>
</div>
</body>
</html> 展开
1个回答
展开全部
你这代码主要是因为只切换了图片,没有切换a的href,所以打开的url没有改变。小小调整一下即可。,示例:
<html>
<head>
<title>轮播块</title>
<script type="text/javascript">
var NowPic = 1; //载入时显示的第一张图片
var MaxPic = 5; //轮流显示的图片张数
var aUrls = ['url1.html', 'url2.html', 'url3.html', 'url4.html', 'url5.html']; // 轮换的url列表
function show(d1) {
if (Number(d1)) { //判断show()参数是否存在,如果存在,设定当前显示的图片为传递参数的图片
NowPic = d1;
document.getElementById("fig_" + d1).className = "numberOver";
}
for (var i = 1; i < (MaxPic + 1); i++) { //轮流显示每一张图片
if (i == NowPic) {
document.getElementById("meinv").src = "images/meinv_" + i + ".jpg";
document.getElementById("link").href = aUrls[i-1]; // 切换url
document.getElementById("fig_" + i).className = "numberOver";
} else {
document.getElementById("fig_" + i).className = "number";
}
}
if (NowPic == MaxPic) { //判断是否最后一张,如果是再从第一张开始循环
NowPic = 1;
} else {
NowPic++;
}
}
var Timer = setInterval('show()', 2000); //利用定时函数每隔2秒调用一次show()函数
window.onload = show;
</script>
</head>
<body>
<div id="main_r1"><a href="#" id="link"><img src="images/meinv_1.jpg" id="meinv"/></a>
<div class="meinv_bg">
<div class="number" id="fig_1" onClick="show(1);">1</div>
<div class="number" id="fig_2" onClick="show(2);">2</div>
<div class="number" id="fig_3" onClick="show(3);">3</div>
<div class="number" id="fig_4" onClick="show(4);">4</div>
<div class="number" id="fig_5" onClick="show(5);">5</div>
</div>
</div>
</body>
</html>
推荐律师服务:
若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询