+ 3
Give created elements random margin every 5 seconds. [JS]
In this code I created 10 elements via JS for experiment. I gave them random margin. newElm.style.marginTop = Math.floor(....) + "%"; Now I want the margin to change randomly every 2 seconds (or any other number). How do we do that? Experimental code: https://code.sololearn.com/WKNzf7JN6K7m/?ref=app
18 Answers
+ 4
https://code.sololearn.com/W5z9c2V2smhD/?ref=app
+ 5
Now I am going to set dynamic background color.
+ 3
Ginfio Check this. Edited by me
https://code.sololearn.com/WcjdKOybzl2X/?ref=app
+ 3
AJ || ANANT || AC || ANANY || AY Now it works.
Really cool.
I played with it for a while: changing the set interval num.
I liked 100 best.
1000 is like a video playing, but lagging.
It doesn't matter thogh.
It looks really cool.
+ 2
AJ || ANANT || AC || ANANY || AY that's what i tried to do in the code, but didn't work.
+ 2
It's working. You have only 1 second. Change it with 2 or 3 second and check.
Height and Width also changing of each blocks.
And why you used for loop. Remove that and check.
Ok. It's for 10 elements.
+ 2
AJ ||
I want it to change margin on the 10 elments only. I dont want to keep creating elements like it's doing right now.
+ 2
id is a unique identifier, cannot be assigned more than once, use class instead.
+ 2
Ginfio this is a better way, no need to assign multiple class, and both can set to more elements by increase the iteration.
https://code.sololearn.com/WEOra0bsVR4b/?ref=app
+ 2
Ginfio Check with Random Color.
https://code.sololearn.com/WcjdKOybzl2X/?ref=app
+ 2
Ginfio for timer callback which is running asynchronously, you cannot assign the nElem directly to asynchronous function. (i think this is the actual cause of your code animate one element only)
So the asynchronous function is binded with current i or nElem and using function argument, n to pass it into the function.
+ 2
Ginfio Check again. We can also call function inside $(document).ready()
+ 1
AJ || ANANT || AC || ANANY || AY I moved the set interval where the margin is, now it's a different problem.
it only works for 1/10 elements.
https://code.sololearn.com/WKNzf7JN6K7m/?ref=app
+ 1
AJ || ANANT || AC || ANANY || AY that works.
I was about to say only 3/10 elements work, but then I saw the CSS.
COOL.
+ 1
Calviղ that works too.
What does the "n" mean by the way?
+ 1
AJ || ANANT || AC || ANANY || AY I think there might be some error when calling the function: I don't think the function is called correctly.
Because when i oress run, it's not doing anything.
0
You can use setInterval method.
0
Ginfio It's happening because you are creating div inside the loop and in setInterval method also. That's why it's creating multiple blocks.
You have to create 10 blocks first with unique id. Then apply height and width on the particular blocks using id in Random order.