Kako koristiti animate u Jquery?

Kako koristiti animate u Jquery? 05.07.2013. u 10:25 · pre 162 meseca #1

JQuery animation()

Imam neku srelicu koja konstantno skakuce gore-dole?

Code:

    function animateIt() {
        $("#selectedLevelSliderID").animate({ marginTop: "-=5px" }, 400);
        $("#selectedLevelSliderID").animate({ marginTop: "+=5px" }, 400);
        animateIt();
    }

I ovo radi.
Ali ja zelim da na osnovu paramtra neke druge funkcije promenim kordinate te strelice i da ona skakuce na nekom drugom mestu.
E kada to pokusam onda mi se zapuca i ne radi.

Jel ima neko ideju u cemu je problem?

Hvala unapred.

Re: Kako koristiti animate u Jquery? 05.07.2013. u 11:55 · pre 162 meseca #2

Zasto koristis rekurziju za ponavljanje animacije?

Koristi setInterval pa probaj da iskombinujes s tim sta si hteo vec..

Code:
setInterval( function() {
        $("#selectedLevelSliderID").animate({ marginTop: "-=5px" }, 400);
        $("#selectedLevelSliderID").animate({ marginTop: "+=5px" }, 400);
        },1200);

1

Re: Kako koristiti animate u Jquery? 05.07.2013. u 12:31 · pre 162 meseca #3

Zato što još uvek učim JQuery, pa mi je to bilo nekako logično.
Hvala na pomoći.
Ali kolko razumem interval je 1200. Šta ako ja hoću da animacija radi beskonačno?

Re: Kako koristiti animate u Jquery? 05.07.2013. u 12:44 · pre 162 meseca #4

setInterval i radi beskonačno, tj. izvršava se na svake 1.2 sekunde. Ako hoćeš da se izvršava na manji period onda smanjiš taj interval.. Takođe možeš napisati i ovako nešto:

Code:

var interval = 1200;
var margin_top_1 = "-=5px";
var margin_top_2 = "+=5px";
var margin_top_1_interval = 400;
var margin_top_2_interval = 400;

var moja_animacija = setInterval( function() {
         $("#selectedLevelSliderID").animate({ marginTop: margin_top_1 }, margin_top_1_interval );
         $("#selectedLevelSliderID").animate({ marginTop: margin_top_2 }, margin_top_2_interval );
         }, interval );

/* ovde ili u okviru neke druge f-je možeš promeniti vrednosti promenljive za margine, i onda samim tim i f-ja za animaciju radi sa novim vrednostima za marginu */
margin_top_1 = "-=15px";
margin_top_2 = "+=15px";

function neka_fja() {
    margin_top_1 = "65px";
    margin_top_2 = "45px";
}

neka_fja();

/* ako hoćeš da prekineš setInterval, koristi ovaj kod: */
window.clearInterval(moja_animacija);

Re: Kako koristiti animate u Jquery? 05.07.2013. u 12:45 · pre 162 meseca #5

Svakih 1200ms funkcija se izvrsi. Probaj

Re: Kako koristiti animate u Jquery? 05.07.2013. u 14:29 · pre 162 meseca #6

Rešio sam. Hvala obojici.
Finkcija izgleda ovako:

Code:

    function animateIt() {
        var selectedLevelPicture=$("#selectedLevelSliderID");
        selectedLevelPicture.css('margin-top',0+'px');
        setInterval( function() {
            selectedLevelPicture.animate({ marginTop: "-=5px" }, 400).animate({ marginTop: "+=5px" }, 400);
        },800);
    }

Morao sam da dodam liniju koda koja svaki put resetuje margin-top na nulu.
Zato što ako prekinem animaciju pa ponovo pokrenem onda ona krene od one vrednosti gde je stala, što je problem jer treba da krene ispočetka.

Forum kao aplikacija na telefonu

Srodne teme