We Keep Coding

hold down button after 1 second and loop the action using jQuery

I got this code from: Jquery: mousedown effect (while left click is held down)
It is behaving that if I am holding the button in every 50ms it will do something.
var timeout = 0;
$('#button_add').mousedown(function () {
timeout = setInterval(function () {
value_of_something ++;
}, 50);
return false;
});
});
But what I want is to execute this part after holding down the button by 1 second and it will continuously do the action 50ms.

As I said you need to use setTimeout()
var timeout = 0;
$('#button_add').mousedown(function () {
setTimeout(function(){
timeout = setInterval(function () {
value_of_something ++;
}, 50);
} , 1000);
return false;
});
Jsfiddle

Please use this code... You have to clearTimeout when user mouseup :
var timeout = 0;
$('#button_add').mousedown(function() {
oneSecondTimer = setTimeout(function() {
timeout = setInterval(function() {
value_of_something++;
}, 50);
}, 1000);
return false;
});
$("#button_add").mouseup(function() {
clearTimeout(oneSecondTimer);
});

How do I stop text scrolling using jQuery

This is my code:
$(document).ready(function() {
function ticker() {
$('#ticker li:first').slideUp(function() {
$(this).appendTo($('#ticker')).slideDown();
});
}
setInterval(function(){ ticker(); }, 3000);
});
I don't know how to stop the text scrolling when I place the mouse over a particular title.SEE HERE MY CODE

Please Try This one:
$(document).ready(function () {
function ticker() {
$('#ticker li:first').slideUp(function () {
$(this).appendTo($('#ticker')).slideDown();
});
}
var clr = null;
function animate(){
clr=setInterval(function () {
ticker();
}, 3000);
}
animate();
$('#ticker li').hover(function () {
// clear interval when mouse enters
clearInterval(clr);
},function(){
// again start animation when mouse leaves
animate();
});
});
DEMO

You can add the a new variable that will save the value for mouse entered
see your updated code
$(document).ready(function() {
var entered = false;
$('#ticker').mouseover(function(){
entered = true;
})
$('#ticker').mouseout(function(){
entered = false;
})
function ticker() {
if(!entered){
$('#ticker li:first').slideUp(function() {
$(this).appendTo($('#ticker')).slideDown();
});
}
}
setInterval(function(){ ticker(); }, 3000);
});

$(document).ready(function() {
var j= setInterval(function(){ ticker(); }, 3000);
var i=1;
function ticker() {
$('#ticker li:first').slideUp(function() {
$(this).appendTo($('#ticker')).slideDown();
i++;
if(i==4){
alert("ok");
clearInterval(j) ;
}
});
}
});
you can set the limit of i and stop the script by using clearInterval() function.

Stop and Reset Harvest's Tick Counter jQuery Plugin

Anyone knows how to stop and reset Harvest's Tick counter jQuery plugin? I want to stop counter on specific number and reset to primary start up number.
You can checkout my code here.
HTML Markup:
<span class="tick tick-flip tick-promo">5,000</span>
jQuery Logic:
<script type="text/javascript">
$(document).ready(function () {
startCounter();
});
function startCounter() {
$('.tick').ticker({
delay: 1000,
incremental: 1,
separators: true
});
}
var myCounter = setInterval(function resetCounter() {
var lsCurrentTick = $('.tick').find('.tick-new').text();
if (lsCurrentTick > 5010) {
$.fn.ticker.stop();
}
}, 1000);
</script>

I had to read the code to figure this out. Here is a DEMO
$(startCounter);
function startCounter() {
var tickObj = $('.tick').ticker({
delay: 1000,
incremental: 1,
separators: true
})[0];
setInterval(function () {
if (tickObj.value >= 5002) {
tickObj.stop();
tickObj.value = 5000;
tickObj.start();
}
}, 1000);
}
If you are feeling brave you can mess with Tick.prototype.tick DEMO
function startCounter() {
var tickObj = $('.tick').ticker({
delay: 1000,
incremental: 1,
separators: true
})[0];
tickObj.tick = (function (tick) {
return function () {
var ret = tick.call(tickObj);
if (tickObj.value > 5002) {
tickObj.stop();
tickObj.value = 5000;
tickObj.start();
}
return ret;
};
}(tickObj.tick));
}

Have a reference to the ticker and to reset you would have to do
ticker[0].stop();
ticker[0].value = 5000;
ticker[0].start();
Full example
$(document).ready(function () {
var ticker;
startCounter();
});
function startCounter() {
ticker = $('.tick').ticker({
delay: 1000,
incremental: 1,
separators: true,
});
}
var myCounter = setInterval(function resetCounter() {
var lsCurrentTick = $('.tick').find('.tick-new').text();
if (lsCurrentTick > 5003) {
reset();
}
}, 1000);
function stop(){
ticker[0].stop();
}
function reset(){
ticker[0].stop();
ticker[0].value = 5000;
ticker[0].start();
}
Here is a demo

Problems with hide() delay on top/sub level menu BUT cancel hide() when mouse enters again

I am having problems with onmouseout/over delay in my menus. I found by changing the setTimeout numbers from 100 to say 2000 it delays the top level menu from hide but not sub level menu and on new onmouseover they still hide, here's what I'm trying to accomplish:
On onmouseout of either primary menu or primary and secondary menu, delay hide for 2-3 seconds BUT ALSO if user returns with onmouseover either element it will cancel the delay and keep showing them.
Most help I find online is just for hide delay but not cancelling it on new onmouseover.
Here is my code:
http://jsfiddle.net/MQ2cg/4/
jQuery.fn.hoverWithDelay = function (inCallback, outCallback, delay) {
this.each(function (i, el) {
var timer;
$(this).hover(function () {
timer = setTimeout(function () {
timer = null;
inCallback.call(el);
}, delay);
}, function () {
if (timer) {
clearTimeout(timer);
timer = null;
} else outCallback.call(el);
});
});
};
$(document).ready(function () {
var hovering = {
mainMenu: false,
categories: false
};
function closeSubMenus() {
$('ul.sub-level').css('display', 'none');
}
closeSubMenus();
function closeMenuIfOut() {
setTimeout(function () {
if (!hovering.mainMenu && !hovering.categories) {
$('#navigation').fadeOut('fast', closeSubMenus);
}
}, 100);
}
$('ul.top-level li').hover(function () {
$(this).find('ul').show();
}, function () {
$(this).find('ul').hide();
closeMenuIfOut();
}, 100);
$('#categories').hoverWithDelay(function () {
$('#navigation').show();
hovering.categories = true;
},
function () {
hovering.categories = false;
closeMenuIfOut();
}, 175);
$('#navigation').hover(function () {
hovering.mainMenu = true;
}, function () {
hovering.mainMenu = false;
});
$('#categories').click(function () {
window.location.href = $('a', this).attr('href');
});
});
Thanks for help.

this questions seem to be similar:
JS for mouseover image upload button (like Facebook)
as Amin Eshaq pointed out use mouseenter / mouseleave
here is working code:
$(this).bind({
'mouseenter' : function () {
timer = setTimeout(function () {
timer = null;
inCallback.call(el);
}, delay);
},
'mouseleave' : function () {
if (timer) {
clearTimeout(timer);
timer = null;
} else outCallback.call(el);
}
});

Rollover delay for Map markers

We had a developer work-up a piece of javascript for animating markers on a map for us. See http://luniablue.com/clients/endowment for it's current state.
The issue I'm having, is that the rollover is too sensitive and I want there to be a 1sec pause before executing the rollover function. From what I've read, I need to declare a setTimeout() function, but I'm not clear on where to insert that.
I have tried every place that I can see and I've had no luck except in breaking the script. I'm sure it's something stupid simple, but javascript isn't my stong point. Can anyone help me out?
Here's the code:
var firstEntry = true;
var lastOn = '';
function showAllPins() {
if ($('#communities').hasClass('theMouseIsOff')) {
var citiesArr = [];
$('.pin').each( function () {
citiesArr.push(this.id);
$('#'+this.id).hide();
});
var stillHidden = citiesArr.length;
while (stillHidden > 0) {
var a = Math.floor(Math.random()*citiesArr.length);
if ($('#'+citiesArr[a]).is(':hidden')) {
$('#'+citiesArr[a]).show().delay(Math.floor(Math.random()*900)).animate({
opacity: 1,
top: '+=40',
}, Math.floor(Math.random()*900), 'easeOutBounce');
stillHidden--;
}
}
firstEntry = true;
$('#communities').removeClass('theMouseIsOff');
}
}
function showPin(relid){
lastOn = relid;
if ($('#communities').hasClass('theMouseIsOff')) $('#communities').removeClass('theMouseIsOff');
if (firstEntry == true) {
$("#communities div[id!=" + relid + "].pin").animate({
opacity: 0,
top: '-=40',
}, 500);
firstEntry = false;
} else {
$("#communities div[id=" + relid + "].pin").animate({
opacity: 1,
top: '+=40',
}, 500, 'easeOutBounce');
}
}
function removeLastPin() {
$('#communities').addClass('theMouseIsOff');
$("#communities div[id=" + lastOn + "].pin").animate({
opacity: 0,
top: '-=40',
}, 500);
setTimeout('showAllPins()',600);
}
$(document).ready( function () {
$('.pin').mouseenter( function () {
relid = $(this).attr('rel');
showPin(relid);
}).mouseleave( function () { removeLastPin() });
});
$(document).ready(function() {
$('.pin').each(function() {
var selector = '#' + $(this).data('tooltip-id');
Tipped.create(this, $(selector)[0], { skin: 'light', hook: { target: 'topmiddle', tooltip: 'bottomleft'}});
});
});

Where you see:
$(document).ready( function () {
$('.pin').mouseenter( function () {
relid = $(this).attr('rel');
showPin(relid);
}).mouseleave( function () { removeLastPin() });
});
You can change it to:
$(document).ready( function () {
$('.pin').mouseenter( function () {
relid = $(this).attr('rel');
setTimeout(function(){showPin(relid)}, 1000);
}).mouseleave( function () { removeLastPin() });
});
By changing the showPin() function to execute after a timeout, the pin should appear after the specified interval.
Update:
If you would like the function only to run if the mouseleave hasn't occurred during the specified interval, you can clear the interval on mouseleave like this:
$(document).ready(function() {
$('.pin').mouseenter(function() {
relid = $(this).attr('rel');
var awaiting = setTimeout(function() {
showPin(relid)
}, 1000);
}).mouseleave(function() {
removeLastPin();
clearInterval(awaiting);
});
});