我已经构建了一个代码,使用setinterval()每5秒更换一次图片,每当图片发生变化时,使用setinterval()也会显示它的不透明度从0增加到1。 这一切都很好,但有一个问题,我可以找到修复它的方法。问题是,在我启动页面之后,如果我移动到差异标签,如果我在一分钟后回来,那么一切都变得狂热,不透明度增长得太快,而且在图片更改之前会超过一次。 这是代码:
var images = [], x = 0, t = 0, timerid, s = 0;
images[0] = "Images/" + location.pathname.substring(1, location.pathname.length - 5) + "2.jpg";
images[1] = "Images/" + location.pathname.substring(1, location.pathname.length - 5) + ".jpg";
function ChangeOpacity() {
img = document.getElementById("img");
s += 0.003;
t = s.toString();
img.style.opacity = t;
if (img.style.opacity>=1) {
s = 0;
clearInterval(timerid);
}
}
function SwitchImage() {
img = document.getElementById("img");
img.src = images[x];
img.style.opacity = 0;
timerid = setInterval('ChangeOpacity()', 1);
x++;
if (x >= images.length)
x = 0;
}
function StartFun() {
setInterval('SwitchImage()', 5000);
}
答案 0 :(得分:0)
您可以添加window.onblur
和window.onfocus
功能。每次选项卡失去焦点(onblur)时,您可以清除间隔并在选项卡再次聚焦时重新启动它(onfocus)。
编辑: 在所有情况下都不需要重新启动间隔。
答案 1 :(得分:0)
任何?请,属于我的高中项目,我必须在星期二之前修好。