Question

I’ve got a div#element that I’m changing css style in interval using jquery.

var i = 0;

function changeStyle() {

    $("#element").css("left",i+1);

}

setInterval("changeStyle()",500);

How do I stop element from changing the style for a while? Is there something like $("#element").stop(); function that enables me to disable element from changing anything on it?

I don’t want any other solution for this problem, I just want to know if there’s anything like stop() function.

Answer 1

The best method to accomplish that is to create an !important CSS rule:

// Lock the `left` style in a fixed state, say "0px"
$('<style id="my-style">#element{left:0 !important;}</style>').appendTo('head');

If the current element does not have an ID, you can temporary assign one.
When the element has to be “unlocked” again, use:

$('#my-style').remove();