Are you enjoying the extensions? Did you like the support? Help others decide.

Leave a review

question-circle setInterval functionality?

More
11 years 7 months ago #1004 by jqueryplease
setInterval functionality? was created by jqueryplease
Hi Everyone,

I downloaded jquery easy to enable jquery on my joomla 2.5 site...It works great for stuff like .animate, but I'm having a problem getting an animation to work that uses setInterval. I assume this is because it's Javascript rather than jQuery...

The relevant jQuery code is below:

var g = 0;
var e = 0;
var b = 0;
var d = 0;

jQuery(document).ready(function($) {

setInterval("animateopener()", 30);

$("#testbutton2").click(function() {

g=0;
e=0;
b=0;
d=0;

}); });

function animateopener () {
/*the function is kind of long, so I'll leave it out*/
}

I didn't include the definition of the function animateopener(), but it basically cycles through the background of a div to create an animation when you click on #testbutton2. It's defined as a function that uses the backgroundPosition property through .css combined with counters for x and y position.

Please help! It might even be a simple coding issue I'm overlooking!

Please Log in or Create an account to join the conversation.

More
11 years 7 months ago - 11 years 7 months ago #1006 by admin
Replied by admin on topic Re: setInterval functionality?
Hello, I would package your code differently, something like (this is an example):
(function($) {	
	$.fn.animate = function(options) {
	
		var defaults = {
			speed: 1000,
			pause: 3000
		};
		
		var options = $.extend(defaults, options);
		
		this.each(function() {
			var obj = $(this);
			// possible code here on obj
					    
		    	var timer = setInterval(function() {
		    		animateopener();
		    	}, options.pause);
	     		
	     		// Pause the animation on mouse over    
		    	obj.hover(
		        	function () {
		            		clearInterval(timer);  
		        	}, 
		        	function () {
		            		timer = setInterval(function(){
						animateopener();
					}, options.pause);        
		        	}
		   	);
		
			function animateopener() {
				// your code here
			};
		});
	};	
})(jQuery);


jQuery(document).ready(function($) {
	$("some html element here").animate({
		speed: 1000,
		pause: 3000
	});
});
Olivier.
Last edit: 11 years 7 months ago by admin.

Please Log in or Create an account to join the conversation.