Home › Forums › JavaScript › Trying to add a timer to this bit code
- This topic is empty.
-
AuthorPosts
-
April 12, 2011 at 11:14 pm #32332RuggParticipant
Hello everybody!
I am trying to add a simple timer or duration to this snip of code, but not having much luck. I am rather new with JS so please excuse my ignorance.
$(document).ready(function(){
jQuery.fn.fadeToggle = function(speed, easing, callback) {
return this.animate({opacity: 'toggle'}, speed, easing, callback);
};
$("#test").click(function() {
$("#test").fadeToggle("slow");
});
});
April 13, 2011 at 12:07 pm #51525JohnnybMemberHey! When you say you’d like to add a timer or duration are you referring to the duration of the animation? Or using a timer to toggle every few seconds for example?
April 14, 2011 at 8:12 am #51419stefanbarMembervar tmr = setInterval(function () { $('#test').trigger('click'); }, 10000);
April 15, 2011 at 1:19 am #51038jamygoldenMemberjQuery.fn.fadeToggle = function(speed, easing, callback) {
return this.delay(1000).animate({opacity: 'toggle'}, speed, easing, callback);
};April 15, 2011 at 3:44 am #51011stefanbarMemberHi NSR
That’s simple, this code below will only run once after 10 seconds. Hope it helps.
var tmr = setTimeout(function() {
clearTimeout(tmr);
$('#test').trigger('click');
}, 10000);April 15, 2011 at 4:44 am #50988stefanbarMemberHi NSR
I would suggest to place it after defining the click event for the DIV#test. What do you mean with merge JS & CSS? For minimizing JS is use http://javascriptcompressor.com/ and wrote my own CSS minimizer.
April 15, 2011 at 4:47 am #50989stefanbarMemberTo merge multiple CSS files, create a merge.css:
@import url('first.css');
@import url('second.css');April 15, 2011 at 5:39 am #50992stefanbarMemberHi NSR
No problem ask away. Regarding merging JS files:
1. Copy and paste all the scripts into a single JS file. lol
2. Load them dynamically with tools like ‘RequireJS’, ‘LabJS’, ‘StealJS’ or ‘Bootstrap’.Cons:
Having all the scripts in one file will make it hard to debug.If i understand correctly you would like to append to the body after a couple of seconds?
$(document).ready(function() {
// appends the two divs after 10 seconds
var bodyTmr = setTimeout(function() {
clearTimeout(bodyTmr );
$('body').prepend('').append('');
}, 10000);
});April 15, 2011 at 6:29 am #50995stefanbarMemberSorry about that, so basically you want to add a loader div and then remove it after a set duration.
$(document).ready(function() {
// add loader div
$('body').prepend('').append('');
// set timer for 10 seconds
var bodyTmr = setTimeout(function() {
clearTimeout(bodyTmr );
// fade out loader div and remove from page
$('#one').fadeOut('fast').remove();
}, 10000);
});April 15, 2011 at 7:01 am #50958stefanbarMemberHi NSR
Just tested the following code below and it works as expected. Just made the #one div completely black instead of a loader image in the center. Maybe you are doing something in your js code?
test
April 15, 2011 at 7:22 am #50960stefanbarMemberlol. So is it working now?
April 15, 2011 at 7:47 am #50962stefanbarMembersure just remove the timer above. (The code i sent you)
April 15, 2011 at 8:11 am #50964stefanbarMemberNo problem.
-
AuthorPosts
- The forum ‘JavaScript’ is closed to new topics and replies.