Interval in JavaScript bookmarlet

Question

I am playing around with bookmark snippets and I am trying to make a loop that changes the background color rapidly. This is my code:

var one;
funtion two() {
  document.body.style.backgroundColor = "#" + Math.floor(Math.random() * 1000);
  setTimeout(two, 1);
}
void 0

I am not very good at coding, so I am trying to make it very simple.

Not sure what `void 0` is doing here, but as far as I know, it's not JS — Jeremy Thille, Feb 13 '18 at 14:51
@JeremyThille Before this question was edited, it was a bookmarklet with the `javascript:` prefix. — Derek 朕會功夫, Feb 13 '18 at 14:52
You call the `two()` function from inside itself, meaning it needs to be called in order to call itself. Funcception. — Jeremy Thille, Feb 13 '18 at 14:52
@JeremyThille (void 0) is valid javascript and evaluates to undefined. — lorefnon, Feb 13 '18 at 14:53
@Derek朕會功夫 perhaps the person who edited it should consider removing it if they are going to snippetize the code... — Heretic Monkey, Feb 13 '18 at 14:53
changing background color every millisecond to a non hex value? — epascarello, Feb 13 '18 at 14:57
https://stackoverflow.com/questions/1484506/random-color-generator — epascarello, Feb 13 '18 at 14:59

Léo R. · Answer 1 · 2018-02-13T15:00:54.500

1

The best solution is to integrate the body's color change method into a setInterval function that will trigger at each desired interval.

window.setInterval(function(){
   document.body.style.background = '#'+Math.floor(Math.random()*16777215).toString(16);

}, 1);

Ps :The interval is in millisecond

edited Feb 13 '18 at 15:00

answered Feb 13 '18 at 14:57

Léo R.

2,620
1
10
22

1

And why should this be better? – Jonas Wilms Feb 13 '18 at 14:58
Better than what ? i think it's the easiest solution to do what OP wants – Léo R. Feb 13 '18 at 14:59
But you should definetly outline what you have changed and why thats better – Jonas Wilms Feb 13 '18 at 15:00

score 1 · Answer 2 · answered Feb 13 '18 at 15:14

You can do what you want with this code snippet:

function randomBackground() {
  var red = Math.floor(Math.random() * 255);
  var green = Math.floor(Math.random() * 255);
  var blue = Math.floor(Math.random() * 255);
  document.body.style.backgroundColor = 'rgb(' + red + ',' + green + ',' + blue + ')';
}
setInterval(randomBackground, 1);

score 1 · Accepted Answer · answered Feb 13 '18 at 16:12

I submitted this snippet as an edit also, but I'm not entirely sure how those work. So I'm also submitting it as answer also. I've accomplished what you want by editing your original code as little as possible. Here's what I changed.

function was spelled funtion
You needed to use setInterval instead of setTimeout
You needed to then initiate that setInterval from outside the function two() you are calling it from: `setInterval(two, 1)
As others have mentioned, you can change the number 1 at the end to any other number of milliseconds you want it to hold each color for.

var one;
function two() {
  document.body.style.backgroundColor = "#" + Math.floor(Math.random() * 1000);
};
setInterval(two, 1);

Cheers!

Wow. "funtion"? I really messed up. :D Thanks for the help! – Komali Feb 13 '18 at 18:25 — Komali, Feb 13 '18 at 18:25

Interval in JavaScript bookmarlet

3 Answers3