count how many times function was executed

时间:2021-11-04 03:19:11

I've website with image on background and i'm willing to make it move from right to left and i do not want to use jQuery so here is my code which makes it do that movement

我的网站上有背景图片,我愿意让它从右向左移动,我不想使用jQuery所以这里是我的代码,它使它做那个运动

HTML Code

<div id="clouds_image"></div>

Javascript Code

var g = 0;
var speed=80;
var counter = 5;
function rollClouds() 
{
    document.getElementById('clouds_image').style.backgroundPosition=g+'px 0';
    g--;
    if (counter < 1) 
        clearInterval(interval);
}

interval = setInterval( function(){ rollClouds() }, speed)

This supposed to make the image moves from right to left and repeat its movement 5 times and counting down from 5 to 0 then will counter < 1 so it will execute clearInterval(interval) to stop it.

这应该使图像从右向左移动并重复其移动5次并从5倒数到0然后将计数<1,因此它将执行clearInterval(间隔)以停止它。

but i do not know why it keep repeating without stop ! so the code might have error so any idea how to make it stop after 5 times of repeating its movement. ~ Thanks

但我不知道为什么它不停地重复!所以代码可能有错误所以任何想法如何使它在重复其运动5​​次后停止。 〜谢谢

1 个解决方案

#1


3  

You don't seem to be decrementing the counter as your code implies you mean to do:

您似乎没有递减计数器,因为您的代码暗示您要执行的操作:

counter--;

Here's the full function:

这是完整的功能:

function rollClouds() 
{
    // decrement (decrease) the counter otherwise it's never less than 1

    document.getElementById('clouds_image').style.backgroundPosition=g+'px 0';
    g--;
    if (counter < 1) {
        clearInterval(interval);
    }
    counter--;
}

#1


3  

You don't seem to be decrementing the counter as your code implies you mean to do:

您似乎没有递减计数器,因为您的代码暗示您要执行的操作:

counter--;

Here's the full function:

这是完整的功能:

function rollClouds() 
{
    // decrement (decrease) the counter otherwise it's never less than 1

    document.getElementById('clouds_image').style.backgroundPosition=g+'px 0';
    g--;
    if (counter < 1) {
        clearInterval(interval);
    }
    counter--;
}