Question

如何将轮播图加上链接 就是轮播的时候点击这图片可以跳转另一个页面

// 轮播图
var carousel_imgs = document.querySelectorAll('#carousel img');
var carousel_spans = document.querySelectorAll('#carousel div.btn span');
var carousel_spans2 = document.querySelectorAll('#carousel2 div.btn2 span');
var carousel_div = document.querySelector('#carousel');
var carousel_div_div2 = document.querySelector('div.btn2');

//--------------------轮播图--------------------
var index = 0;
var timer = setInterval(lunbo,2000);

function lunbo(){

index++;
if(index == 8){
index = 0;
}
show();
}

function show(){
for(var i = 0;i < carousel_imgs.length;i++){
carousel_imgs[i].style.display = 'none';
carousel_spans[i].style.backgroundColor = 'white';
}
carousel_imgs[index].style.display = 'block';
carousel_spans[index].style.backgroundColor = 'red';
}

function next(){
index++;
if(index == carousel_imgs.length){
index = 0;
}
show();
clearInterval(timer);
timer = setInterval(lunbo,2000);
}

function prev(){
index--;
if(index < 0){
index = carousel_imgs.length - 1;
}
show();
clearInterval(timer);
timer = setInterval(lunbo,2000);
}
carousel_div.onmouseenter = function(){
carousel_div_div2.style.display = 'block';
}
carousel_div.onmouseleave = function(){
carousel_div_div2.style.display = 'none';
}
for(var i = 0;i < carousel_spans.length;i++){
carousel_spans[i].index = i;
carousel_spans[i].onmouseover = function(){
index = this.index;
show();
clearInterval(timer);
}
carousel_spans[i].onmouseleave = function(){
index = this.index;
timer = setInterval(lunbo,2000);
}
}
这个是我轮播图那块的Css代码

Answer 1

在html里面写就好了，如下：
<a href="放你点击此图片时需要跳转的连接" name="a_pinXuan">
<img src="images/carousel_2.jpg" alt="图片">
</a>
在图片的外面加个a标签

追问

加a标签不行 会扩大本来的那块 把其他的东西顶到下面去

就会成为这样

追答

给你个网站参考一下千图网