Develop Reference

Pause simple fader script on mouse-hover

I would like pause on hover when the mouse hovers over the fadelinks div for this script:
$(function(){
$('.fadelinks > :gt(0)').hide();
setInterval(function(){$('.fadelinks > :first-child').fadeOut().next().fadeIn().end().appendTo
('.fadelinks');}, 5000);
});
The html is along the lines of:
<div class="fadelinks">
<div>...</div>
<div>...</div>
</div>
I've tried a few things relating to interval to try and cram pause on hover functionality in there, but with my extremely limited jquery knowledge, everything I've tried breaks the script, leaving it stuck on the last slide or the first slide. Would just like this simple script to pause on mouse-hover and start up again on mouse-exit.
Here's a JSFiddle of the script in its natural state.

Try using .hover() , declaring variable to reference setInterval , using a function to call setInterval
$(function(){
// define `_interval` variable
var _interval;
// cache `.fadelinks` element
var elem = $(".fadelinks");
elem.find("> :gt(0)").hide();
elem.hover(function() {
// "pause" at `hover` of `.fadelinks`
clearInterval(_interval)
}, function() {
// "reset"
interval()
});
var interval = function() {
_interval = setInterval(function(){
elem.find("> :first-child")
.fadeOut().next().fadeIn().end()
.appendTo(elem);
}, 2000)
};
interval()
});
jsfiddle https://jsfiddle.net/ccmgdfog/4/

In your case, there wasn't the need for jQuery. Only with stopInterval you can control it. Altrough there is the jQuery $.stop() function, we wouldn't get the desired result.
I've changed a bit your code:
$(function(){
$('.fadelinks > :gt(0)').hide();
var interval = setInterval(intervalFunc, 2000);
$('.fadelinks').on('mouseenter',function(){
clearInterval(interval);
});
$('.fadelinks').on('mouseout',function(){
interval = setInterval(intervalFunc, 2000);
});
function intervalFunc(){
$('.fadelinks > :first-child').fadeOut().next().fadeIn().end().appendTo('.fadelinks');
}
});

setInterval after setTimeout

var playtop = setInterval(goright, 5000);
function goright(){
...
}
The above works.
Now, I need to interrupt the above by clicking on a button, do something on page, and ten seconds after click - activate the setInterval again.
$("#btngoright").click(function(){
clearInterval(playtop);
...
setTimeout(playtop, 10000);
});
But, once interrupted, setInterval is not activated again.

It's not working because playtop is the id that was returned when initially setting the interval.
The setTimeout method expects a function, not an id, therefore you should pass a reference to the goright function again:
setTimeout(goright, 10000);
If you want to activate the interval again after 10 seconds, you can set an interval and pass a reference to the goright function in an anonymous function:
$("#btngoright").click(function(){
clearInterval(playtop);
setTimeout(function () {
setInterval(goright, 5000);
}, 10000);
});

Nearly. It should be:
$("#btngoright").click(function(){
clearInterval(playtop);
setTimeout(function () {
playtop = setInterval(goright, 5000);
}, 10000);
});
This way you are putting control back into the playtop variable meaning that the interrupt function will work more than once.

Javascript/JQ Content removal after certain time (timer)

I simply wonder if it's possible to make a function where you have a timer/clock which ticks and when there is no time left, a text/image will be removed. There will also be a message/text displaying notifying the user. (JQuery or Java)
I have tryed this using replace.child but without any promising result.
I have also looked around for any similar object but none found.
-Thanks.

here you go:
(function(){
var secondsLeft = 10,
$timerElm = $('#timer');
function updateTimer () {
$timerElm.text(secondsLeft--);
if (secondsLeft < 0) timesUp();
else setTimeout(updateTimer, 1000);
}
function timesUp () {
$('#target').remove();
$('<p>works like a charm!</p>').prependTo('body').hide().fadeIn()
}
updateTimer();
})()
and here is a live demo too!
http://jsbin.com/aguyuw/1/edit
enjoy!

You can use setTimeout function...
setTimeout(function() { $('#some_id').fadeOut('slow');}, 2000);
here 2000 is an optional value... you can change as you concern... and if you want to fadeout fast you can use 'fast' instead of 'slow'...
For javascript you can use something like this....
setTimeout(function(){you_function();},3000);

jQuery/JS infinite timed loop

I am trying to create a series of clicks on different elements on screen at different times. I can easily do this using the setTimeout function, but I need to make this an infinite loop!?
Here is a snippet of how I am currently handling the code.
setTimeout(function () {jQuery('.CR_1').trigger('click');}, 1000);
setTimeout(function () {jQuery('.CR_1').trigger('click');}, 5000);
setTimeout(function () {jQuery('.CR_2').trigger('click');}, 5500);
Any ideas on how I can make this work?
EDIT: Let me a little more clear. I am trying to run the set of functions in the same order over and over. The setInterval worked perfectly. I am super sorry for any confusion.
setInterval ( "flips ()", 12000 );
function flips (){
setTimeout(function () {jQuery('.CR_1').trigger('click');}, 1000);
setTimeout(function () {jQuery('.CR_1').trigger('click');}, 5000);
setTimeout(function () {jQuery('.CR_2').trigger('click');}, 5500);
}

Just call setTimeout from within your function.
setTimeout(callMe, 1000);
function callMe() {
jQuery('.CR_1').trigger('click');
setTimeout(callMe, 1000);
}
You could also use setInterval but I prefer doing it this way because it will be called 1000ms from the last run, not every 1000ms regardless of how long it takes to run (if the process is synchronous).

clicky()
function clicky() {
setTimeout(function () {jQuery('.CR_1').trigger('click');}, 1000);
setTimeout(function () {jQuery('.CR_1').trigger('click');}, 5000);
setTimeout(function () {jQuery('.CR_2').trigger('click');clicky()}, 5500);
}

i think you should use setInterval instead of setTimeout

Why not use setInterval instead?

var delayedFunctions = [
[1000,function(){ ... }],
[5000,function(){ ... }],
[5500,function(){ ... }]
];
var fIndex = 0;
function runDelayedFunctions(){
var details = delayedFunctions[fIndex];
setTimeout( function(){
details[1].call(this);
if (++fIndex >= delayedFunctions.length) fIndex=0;
runDelayedFunctions();
}, details[0] );
};
runDelayedFunctions();

setInterval is not working in YUI

I am trying to use SetInterval and clearInterval in YUI
The code is written so it will create element every second and on mouse hover of div it should stop creating element.
http://jsbin.com/awadek/5
Please let me know what is wrong with my code?

You should pass an anonymous function as a handler to "mouseover". Otherwise, Javascript will attempt to evaluate and call the return from clearInterval (in this case, an integer!). The following code will work:
YUI().use("console", "console-filters", "substitute", "node-event-simulate",
function(Y) {
console.log("YUI is ready");
var doSomething = function(e) {
Y.one("#seconds").append("<p>I am number four</p>");
};
IntervalId = setInterval(doSomething, 1000);
//Notice the anonymous function below:
Y.one("#clearInt").on('mouseover', function() { clearInterval( IntervalId ) });
});
Here is your JSBin, ftfy. Enjoy!