jquery - animate and resetting interval -
i bit new @ jquery , need help, searched net solution , tried edit meet requirement. wanted change background event , there slider inside content , when changing controls, background change. i've done had 2 problems:
- i need reset interval when clicked (now mixing up)
- i need animate change in background insted of changing directly (ease or fade)
here code:-
$(window).load(function(){ var images = ['images/background/body-bg.jpg','images/background/body-bg2.jpg']; var = 0; function changebackground() { $('html').css({ 'background': function(){ if (i >= images.length) { i=0; } return 'url(' + images[i++] + ')'; }, 'background-position':'center', 'background-attachment':'fixed', 'background-size':'cover' }) } // call on first time changebackground(); (function(){ $('.slidercontrol > li').children().on('click', function(){ changebackground(); window.clearinterval() }) })(); // set interval continue setinterval(changebackground, 5000); });
using js tween library acheive easily
{ id: "jsframe1", //audio: "<filename , path, without extension>", play: function(jqtarget, fncallback) { jqtarget.find(".jsimage1").tween({ transform:{ start: 'rotate(0deg) scale( 1 )', stop: 'rotate(360deg) scale( 1 )', time: 0, duration: 1, effect:'linear' }, width: { start: 1, stop: 100, time: 0, duration: 1, units: '%' }, height: { start: 1, stop: 100, time: 0, duration: 1, units: '%' }, }); settimeout(fncallback, 7000); $.play(); } },
Comments
Post a Comment