Call a Function in callback of Animate Effect

[Mrshcom]

Slm! che jori mitonam ye function ro dar callback evente Animate farakhani konam: inam codame :

$(function(){

var pics = $('div.container div.border div.pixel');
var btn_1 = $('div.btn:nth-child(1)');

rnd = function(a,b){
    return (Math.floor(Math.random()*(b-a+1))+a);   
}

    var itop = 0, 
        ileft = 0, 
        n = 16, // num of div in a row
        iwidth = pics.width(),  // width of divs
        iheight = pics.height(); // height of divs

position = function() {

    if(ileft == (n*iwidth)) {ileft=0;  itop += iheight; }
    $(this).css({'background-position': (-ileft) + 'px ' + (-itop) + 'px'});
    $(this).animate({top:itop, left:ileft},600);
    ileft += iwidth;

}

pics.each(position);

////////////// Change Image with Effect ////////////////////////////////////////////////
btn_1.click( hide = function(){
    itop = 0;
    ileft = 0;
    num_img = rnd(1,5);

    pics.each(function(){
        $(this).animate({top:rnd(0,360),
                        left:rnd(0,360),
                        '-webkit-transform':'rotate(' + rnd(-360,360) + 'deg)'
        },400,'cubic-bezier(0.95,0.001,0.97,0.002)',function(){

                $(this).animate({backgroundImage:'url(\'images/' + num_img + '.jpg\')', 
                                '-webkit-transform':'rotate(0deg)'                  
                        });

                // this is position function
                if(ileft == (n*iwidth)) {ileft=0;  itop += iheight; }
                $(this).css({'background-position': (-ileft) + 'px ' + (-itop) + 'px'});
                $(this).animate({top:itop, left:ileft},600);
                ileft += iwidth;

            });     

    });
});

});

[AliGH]

salam. faghat kafie ye function benevisi kare khasi nemikhad anjam bedi

[Mrshcom]

khob man intori minvisam ejra nemishe:

$(function(){

var pics = $('div.container div.border div.pixel');
var btn_1 = $('div.btn:nth-child(1)');

rnd = function(a,b){
    return (Math.floor(Math.random()*(b-a+1))+a);   
}

    var itop = 0, 
        ileft = 0, 
        n = 16, // num of div in a row
        iwidth = pics.width(),  // width of divs
        iheight = pics.height(); // height of divs

position = function() {

    if(ileft == (n*iwidth)) {ileft=0;  itop += iheight; }
    $(this).css({'background-position': (-ileft) + 'px ' + (-itop) + 'px'});
    $(this).animate({top:itop, left:ileft},600);
    ileft += iwidth;

}

pics.each(position);

////////////// Change Image with Effect ////////////////////////////////////////////////
btn_1.click( hide = function(){
    itop = 0;
    ileft = 0;
    num_img = rnd(1,5);

    pics.each(function(){
        $(this).animate({top:rnd(0,360),
                        left:rnd(0,360),
                        '-webkit-transform':'rotate(' + rnd(-360,360) + 'deg)'
        },400,'cubic-bezier(0.95,0.001,0.97,0.002)',function(){

                $(this).animate({backgroundImage:'url(\'images/' + num_img + '.jpg\')', 
                                '-webkit-transform':'rotate(0deg)'                  
                        });

                position();

            });     

    });
});

});

[Mrshcom]

Function Position ro bala tarif kardam va to callback farakhni mikonam vali ejra nemishe!??!!!! :S

[AliGH]

link code hat ro bede

[AliGH]

un cubic-bezier i ke zadi ro bardar be jash linear ya ye chiz dg bezar bebin fix mishe

[Mrshcom]

emtehan kardam j nadad!??!!!!! inam linke project ke push kardam... mamnon misham ye niga bekonid : https://github.com/Mrshcom/HomeWork_Project/tree/master/Multi%20Div

[AliGH]

$(function(){
    $('div.box1').animate({'margin-left':'400px'},1000,null,function(){

        $('div.box2').animate({'margin-left':'400px'},1000,null,function(){

            $('div.box3').animate({'margin-left':'400px'},1000);

        });

    });
});

[Mrshcom]

aghaye @AliGH mikham ye Function ro ke ye ja dg tarif kardamo to callback faghat farkhani konam dg nemikham kole codasho benvisam akhe azin Function chand ja dg ham bekar bordam!(Function Position ke dar balaye coda tarif kardam)!

[Mrshcom]

plz help me!

[AliGH]

ok, bezar ye bar codat ro bayad ba deghat bekhonam hamasho

[Mrshcom]

mamnon! pas montazeram! :D

[AliGH]

@Mrshcom az unjayi ke man motmaenam moshkelet az callback nis va inke vaghean alan vaght nemikonam ke codat ro debug konam pas azat mikham khodet in karo anjam bedi va moshkel ro peyda koni age toonesi halesh koni ke hichi agar ham natoonesi hatman issue bezar inam bara etminanet alan zadam

$(function(){
    opacity= function(){
        $('div.box1').css('opacity','.5');
    }

    bg = function(){
        $('div.box1').animate({'background-color':'red'});  
    }

    $('div.box1').animate({'margin-left':'400px'},1000,null,bg(),opacity());

});

[Mrshcom]

@AliGH mamnon az javabeton vali man mikham dakhele callback ye function seda bezanam ke har chi emtehan mikonam j nemide!

intori:

$(function(){ opacity= function(){ $('div.box1').css('opacity','.5'); }

bg = function(){
    $('div.box1').animate({'background-color':'red'});  
}

$('div.box1').animate({'margin-left':'400px'},1000,null,function(){
      opacity();
});

});

vali javab nmide! khodeton codamo didin dg az function position ziad estefade mishe bara hamin mikham yebar tarifesh konam bad sedash bezan!

[AliGH]

khahesh mikonam @Mrshcom ye soal alan slideshow t dare kar mikone bedoone moshkel kojaye be khata mikhori? va inke az koja mifahmi ke to callback moshkel dari va ye chiz dg ye alert to function positionet bezar va bad mibini ke alert mishe bara inke befahmi be hamoon andazee alert mishe ke farakhani mishe to html masalan 10 ta div besaz va bad test kon

[Mrshcom]

are moshkeli nadare! vali vaghti function position() ro to call back farakhani mikonam in Error ro to console mide: ( Uncaught TypeError: Cannot read property 'cssText' of undefined ) dar Zepto.js moshkel zamanie ke bekham function ro to callback farakhani konam vali mamoli ke biam to callback code benvisam moshkeli nis! alert mizaram vali asan alert nemishe!! inam linke khode proje bara test: http://mampel.ir/Projects/Multi%20Div/MultiDiv.html

age moshkeli nadarin ke man proje ro baraton Email konam!

[Mrshcom]

?? :D

[Mrshcom]

@AliGH lotfan age vaght darin javab bedin!! mamnon!

[AliMD]

@AliGH in hal shode ?

[AliMD]

alan in be koja resid ? bebandim ya na ?

[Mrshcom]

ee in mage hano close nashode?? :D are hal shode!