添加脚本中的图像链接

时间:2016-03-07 16:06:01

标签: javascript

此脚本将DIV“middle”的背景替换为数组中列出的图像。目前该脚本工作正常,但我希望能够为每个图像分配一个链接,尝试更换,但是图像没有显示,链接也不起作用。

<script>
var images=new Array('/images/home/imgone.jpg', '/images/home/imgtwo.jpg', '/images/home/imgthree.jpg', '/images/home/imgfour.jpg', '/images/home/imgfive.jpg');
var nextimage=0;
doSlideshow();

function doSlideshow(){
if(nextimage>=images.length){nextimage=0;}
$('.middle')
.css('background-image','url("'+images[nextimage++]+'")')
.fadeIn(500,function(){
    setTimeout(doSlideshow,5000);
});
}
</script>

我正在寻找的是这样的。

<script> 
var images=new Array('/images/home/imgone.jpg', '/images/home/imgtwo.jpg', '/images/home/imgthree.jpg', '/images/home/imgfour.jpg', '/images/home/imgfive.jpg'); To: var images=new Array('<a href="linkone"><img src="/images/home/imgone.jpg"</a>', '<a href="linktwo"><img src="/images/home/imgtwo.jpg"</a>', '<a href="linkthree"><img src="/images/home/imgthree.jpg"</a>', '<a href="linkfour"><img src="/images/home/imgfour.jpg"</a>', '<a href="linkfive"><img src="/images/home/imgfive.jpg"</a>');
</script>

1 个答案:

答案 0 :(得分:0)

虽然这并没有完全回答你的问题,但也许你可以从DOM函数中获得一些想法。

<强> 实施例

<script>

  // Creates Image
  var image = document.createElement("img");

  // Sets Image Attributes
  image.src = "http://i.imgur.com/gqdqudn.png";
  image.width = "30";
  image.height = "30";

  // Adds Image to Body
  document.body.appendChild(image);

</script>

这会将图像附加到身体上。如果您想将其添加到特定ID,您可以执行以下操作(假设您的div id为&#34; destination&#34;)。

<强> 实施例

<!DOCTYPE html>

<html>

<body>

  <div id="destination">

    <!-- Destination Div -->

  </div>

<script>

  // Creates Image
  var image = document.createElement("img");

  // Sets Image Attributes
  image.src = "http://i.imgur.com/gqdqudn.png";
  image.width = "30";
  image.height = "30";

  // Adds Image to Body
  document.getElementById("destination").appendChild(image);

  </script>

</body>

</html>
祝你好运!