Question

我所拥有的是3张图片但不在线，我需要将这三张图片链接到不同页面！每个图像的每个链接

＆＃13;

var images = [
  'image/dragao1.jpg',
  'image/dragao2.jpg',
  'image/dragao3.jpg'
];

function slideShowForward() {
  images.push(images.shift());
  document.getElementById('imagesP').style.backgroundImage = 'url(' + images[0] + ')';
}

function slideShowBack() {
  images.unshift(images.pop());
  document.getElementById('imagesP').style.backgroundImage = 'url(' + images[0] + ')';
}

＆＃13;

<div id="imagesP" style=" border: 1px solid black; height: 200px; width:750px;">
  <div id="form">
    <input type="button" value="previous" onclick="slideShowBack();" style="width: 39px; height: 34px;" />
    <input type="button" value="next" onclick="slideShowForward();" style="width: 39px; height: 34px;" />
  </div>
</div>

＆＃13;

Answer 1

var images = [
  'http://cinemacomrapadura.com.br/imagens/2014/01/20140127-como-treinar-seu-dragao1.jpg',
  'http://cinemacomrapadura.com.br/imagens/2014/01/20140127-como-treinar-seu-dragao2.jpg',
  'http://br.web.img2.acsta.net/c_520_690/newsv7/15/02/06/17/22/496087.jpg'
];
var hrefs=["http://www.google.com","http://www.msdn.com","http://www.yahoo.com"]

function slideShowForward() {
  images.push(images.shift());
  hrefs.push(hrefs.shift());
  document.getElementById('imagesP').style.backgroundImage = 'url(' + images[0] + ')';
  document.getElementById('imagesP').setAttribute(href,hrefs[0]);
}

function slideShowBack() {
  images.unshift(images.pop());
  hrefs.unshift(hrefs.pop());
  document.getElementById('imagesP').style.backgroundImage = 'url(' + images[0] + ')';
  document.getElementById('imagesP').setAttribute(href,hrefs[0]);
}
window.onload=function() {
  document.getElementById('imagesP').onclick=function(e) {
    var tgt = e.target||e.srcElement;
    if (tgt.tagName.toLowerCase()=="input") e.preventDefault();
    else location=this.getAttribute("href");
  }
}

#imagesP { border: 1px solid black; height: 200px; width:750px;  background-image: url(http://br.web.img2.acsta.net/c_520_690/newsv7/15/02/06/17/22/496087.jpg)}

<div id="imagesP" href="http://www.google.com">
  <div id="form">
    <input type="button" value="previous" onclick="slideShowBack();" style="width: 39px; height: 34px;" />
    <input type="button" value="next" onclick="slideShowForward();" style="width: 39px; height: 34px;" />
  </div>
</div>

图片中的Javascript链接

1 个答案: