Question

更新：以下答案似乎有效，但如果我在说明变量中的文字中有链接，那么它似乎根本不会替换文本。如果我从我试图替换的所有文本中删除标签或任何html标签，它都可以。问题是，我需要将文本替换为html格式：（

我试图让图像淡出，图像外的文字也会褪色，并且另一组也出现在同一个地方。

由于环境原因，无法使用

jquery。

我想出了这个，唯一的问题是第一件事就是第一张图片在一开始就会消失并出现相同的图像。然后它在第一次“故障”之后开始正常工作。在那之后，如果看起来效果很好。

有人可以指出我的愚蠢错误吗？

<script type="text/javascript">
        var links = ["http://www.firstlink.com","http://www.secondlink.com","http://www.thirdlink.com"];
        var images = ["1stimage.jpg","2ndimage.jpg","3rdimage.jpg"];

       var descriptions=["this is the first set of rotating text", "Now we have another set of text, in this large paragraph.  Write whatever we want here", "and this is the last set of text, we have 3 images.  We can add more images and more text."]

        var i = 0;

        var renew = setInterval(function(){
            if(links.length == i){
                i = 0;
            }
            else {


           document.getElementById("bannerImage").src = images[i];
           fadeIn(document.getElementById("bannerImage"), 1000);
            document.getElementById("bannerLink").href = links[i];
            document.getElementById("p1").innerHTML= descriptions[i];


            i++;

        }
        },5000);
        </script><script type="text/javascript">
function fadeIn(el, time) {
  el.style.opacity = 0;
  el.style.display = "block";

  var last = +new Date();
  var tick = function() {
    el.style.opacity = +el.style.opacity + (new Date() - last) / time;
    last = +new Date();

    if (+el.style.opacity < 1) {
      (window.requestAnimationFrame && requestAnimationFrame(tick)) || setTimeout(tick, 16)
    }
  };

  tick();
}
</script><a href="http://www.1stlink.com" id="bannerLink" onclick="void window.open(this.href); return false;"><img alt="some text" height="83" id="bannerImage" src="1stimage.jpg" width="633" /> </a>
<p id="p1">this is the first set of rotating text</p>

Answer 1

更改此

var images = ["1stimage.jpg","2ndimage.jpg","3rdimage.jpg"];
var descriptions=["this is the first set of rotating text", "Now we have another set of text, in this large paragraph.  Write whatever we want here", "and this is the last set of text, we have 3 images.  We can add more images and more text."]

到这个

var images = ["2ndimage.jpg","3rdimage.jpg","1stimage.jpg"];
var descriptions=["Now we have another set of text, in this large paragraph.  Write whatever we want here", "and this is the last set of text, we have 3 images.  We can add more images and more text.", "this is the first set of rotating text"]

图像仅在javascript中旋转 - 没有jquery

1 个答案: