We Keep Coding

make auto click using jquery

I'm using trigger click for auto click wit trimmer on an item can anyone help me to put this in infinity loop so it keep repeat it self again and again but using jQuery not JavaScript.
setTimeout(function() {
$('#click2').trigger('click');
}, 4e3);
setTimeout(function() {
$('#click2').trigger('click');
}, 8e3);
setTimeout(function() {
$('#click3').trigger('click');
}, 12e3);

setInterval(function() {
$('#click2').trigger('click');
setTimeout(function() {
$('#click3').trigger('click');
}, 500)
}, 1000 /* in milliseconds */);
This triggers both button clicks every second.
Not sure why you need this though. I am sure there is a better way to achieve what it is you are trying to accomplish.

use setInterval
setInterval(function() {
$('#click2').trigger('click');
}, 1000);

jQuery show div for 2 seconds then hide for 4 seconds in a loop [duplicate]

This question already has answers here:
What is the difference between a function call and function reference?
(6 answers)
Closed 5 years ago.
How to show a div for 2 seconds and then hide it for 4 seconds in an infinite loop? I use jQuery's animate() function because I want to use CSS transitions too.
function animatedText() {
setTimeout(function() {
$('.text').animate({ opacity: 1 }, 200, function() {
setTimeout(function() {
$('.text').animate({ opacity: 0 }, 200);
}, 1800);
});
}, 3800);
}
setInterval(animatedText(), 6000);
Here is my fiddle : https://jsfiddle.net/od6gm8t3/

I hope this will help you. Please check below code.
function animatedText() {
$('.text').animate({ opacity: 1 }, 200, function() {
setTimeout(function() {
$('.text').animate({ opacity: 0 }, 200);
}, 2000);
});
setTimeout(function() {
animatedText();
},6000);
}
animatedText();
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<i class="text">Animated Text</i>

How do I do 3 animations in jQuery and loop them? (Timing is messed up.)

I have a three different transitions for fading out and fading in my 3 images.
animate1 = function() {
$('#changingImage').fadeOut('fast', function() {
$('#changingImage').attr("src","../files/others/image1.jpg");
$('#changingImage').fadeIn('fast');
});
};
I have this same function two more times, just replacing the 1s with 2s and 3s.
I call my three functions with this, repeating every 5 seconds:
animate1().delay(5000);
animate2().delay(10000);
animate3().delay(15000);
I'm new at jQuery, and I don't understand why the timing is wrong. All that happens is image2 (the original) gets replaced with image1, and that's it.

Try using the setTimeout() javascript function.
Documentation: http://www.w3schools.com/jsref/met_win_settimeout.asp
For example:
setTimeout(function(){ animate1(); }, 5000);
setTimeout(function(){ animate2(); }, 5000);
setTimeout(function(){ animate3(); }, 5000);
This basically 'pauses' your JavaScript/jQuery code for 5 seconds before running the function and continuing.

.delay() does not repeat an event, it just delays its execution. You need .setInterval() if you want to repeat an event based on a given interval:
window.setInterval(function(){
setTimeout(animate1, 1000);
setTimeout(animate2, 500);
}, 5000);
Demo: https://jsfiddle.net/erkaner/bfb7jgaL/1/

Yay! I figured it out with a bunch of help.
var animations = function() {
setTimeout(function() {
animate1();
console.log("Animation 1")
}, 5000);
setTimeout(function() {
animate2();
console.log("Animation 2")
}, 10000);
setTimeout(function() {
animate3();
console.log("Animation 3")
}, 15000);
};
setInterval(animations, 15000);

Hi i have a suggestion for you in case that you have more than this 3 image so you will create a new function for it ?
so what about to use only 1 function that will call it self with an attribute that define image name as it is the only thing is changing every time so you can use this better and less code ,you have just the n value will change every time will increase and the max value witch define how many image you want
//if you want to set this animation for more than 3 image just change the max value
var max=3;
setTimeout(function(){ animate(2); }, 5000);
animate = function(n) {
$('#changingImage').fadeOut('fast', function() {
if(n<=max){
$('#changingImage').attr("src","http://www.imacros-scripts-for-free.is-best.net/image"+n+".jpg");
$('#changingImage').fadeIn('fast');
if(n==max){n=1}else{n++;}
setTimeout(function(){ animate(n); }, 5000);
}
});
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<img id="changingImage" src="http://www.imacros-scripts-for-free.is-best.net/image1.jpg" width="200px">

Automatically move div with javascript on delay

I have the below piece of code that moves a onto the screen when ?added is in the URL which works great. I now need to add a piece of code to it that then moves the back over after 5 seconds. I have noticed there's a delay function but I'm not sure how to add it into the code. Can anyone help? Many thanks!
$(document).ready(
function () {
if (document.URL.indexOf("?added") >= 0) {
$('#popout-left-menu-container')
.animate({
'right': '2px'
}, 300);
};
});

You can use the setTimeout function to delay something in javascript. Maybe like this:
$('#popout-left-menu-container').animate({'right':'2px'},300);
setTimeout(function(){
//This is animation that runs after 5 seconds. You can use it to move the block back.
//You have to set your parameters yourself here
$('#popout-left-menu-container').animate({'right':'0px'},300);
}, 5000);

$(document).ready(
function () {
if (document.URL.indexOf("?added") >= 0) {
setTimeout(function(){
$('#popout-left-menu-container')
.animate({
right:'2px'
},300);
},5000);
};
});

You should do it with .delay().
$("query").animate(firstAnimation, firstDuration).delay(milliseconds).animate(secondAnimation, secondDuration);

Second div to autoplayed always 1 sec after the first div

My question is how can I have #slider to be played always 1 second after #faded. Having it in 4 secs and 5 secs is not a stable way.
$(function(){
$("#faded").faded({
autoplay: 4000
});
});
$(function(){
$("#slider").faded({
autoplay: 5000
});
});

Is this what you want / need? It will fade in the first element after 4 seconds and when that is done, it will trigger a second timer after 1 second:
setTimeout(function() {
$('#faded').fadeIn('normal', function() {
setTimeout(function() {
$('#slider').fadeIn('normal');
}, 1000);
});
}, 4000);

Here is one problem you are facing:
$(function(){... this event happens before the page is render, thus creating inconsistencies in your code.
I would recommend that you change it to window.onload = function (){....
this should fix the problem.