使用jQuery动态更改图像源

时间:2013-05-03 21:20:11

标签: jquery

以下脚本的目的是运行大约8分钟,显示为imageShowtimeinms和transitionRunTimeinms编码的值,此时原始图像将显示为永久图像(理性的是大多数人在7-8内留下一个站点分钟)。变量允许我改变那个时间。

代码不会多次更改图像。目的是让外循环运行x次,并且在其中,使用setInterval运行图像循环,以便每个图像显示imageShowtimeinms变量中定义的毫秒数。然后这将重新开始并再次运行,直到外循环完成。

 var imageShowtimeinms = 15000;
 var transitionRunTimeinms = 450000;
 var arrayOfTransitionImages = ["Images/main_png_270x180.png", "Images/mainTransparent_270x180.png", "Images/Main2TransparentBackground_270x180_20pct.png"];
 var numArrayImages = arrayOfTransitionImages.length;
 var loopsToRun = transitionRunTimeinms / (imageShowtimeinms * numArrayImages);
 for (i = 0; i < loopsToRun; i++) {
      for (var t = 0; t < numArrayImages; t++) {
         setInterval(function () {
         $('#logotransitions img').attr('src', arrayOfTransitionImages[t]).fadeIn(800);
                        }, imageShowtimeinms);
      }
 }

更新:此迭代有效,图像每15秒连续变化一次。

     $(document).ready(function() {
            'use strict';
           var arrayOfTransitionImages = ["Images/main_png_270x180.png", "Images/mainTransparent_270x180.png", "Images/Main2TransparentBackground_270x180_20pct.png"];
            var imageShowtimeinms = 15000;
            var innerCounter = 0;
                setInterval(function () {
                    $('#logotransitions img').attr('src', arrayOfTransitionImages[innerCounter]);
                    innerCounter += 1;
                    if (innerCounter === 3) {
                        innerCounter = 0;
                    }
                }, imageShowtimeinms);
        });

0 个答案:

没有答案