Callback jQuery, sintaxis

[MadDunDee]

Hola, veréis necesito pasar una secuencia de código como callback y no sé bien cómo escribirlo.

La callback tiene que ir aquí:

Código PHP:

   $('#list-works').quicksand($filteredData, { 
        duration: 300, 
        easing: 'easeInOutQuad', 
        useScaling: true, 
        adjustHeight: true, 
        timezone: +10 
       (CALLBACK) 
      });  
   

Y tiene q pasarse el siguiente código:

Código PHP:

  $('.hover-fx-slide').hover(   
    function () {   
   
        value = $(this).find('img').outerHeight() * -1;   
           
        $(this).find('img').stop().animate({top: value} ,{duration:200, easing: 'linear'});      
           
    },   
    function () {   
            
        $(this).find('img').stop().animate({top:0} ,{duration:300, easing: 'linear'});       
       
    });  
   

Como véis se trata de un plugin llamado quicksand q permite reorganizar elementos o items de una forma muy visual atractiva. El plugin en cuestión es este, por si os interesa --> http://razorjack.net/quicksand/docs-and-demos.html

En esta misma página podéis ver una sección q dice "Integración con otros plugins". Aquí se explica de la siguiente manera que no sé implementar:

Código PHP:

  $("#content").quicksand($("#data > li"),  
  { 
    duration: 1000, 
  }, function() { // callback function 
    $('#content a').tooltip(); 
  } 
);  
   

Pues bien, es ahí donde explica como pasar otras funciones como callback y yo no sé escribirlo correctamente. No es otro plugin lo q quiero pasar, si no una serie de funciones q realizan distintos efectos sobre cada item. El de arriba es solo un ejemplo, habría más de estos con declaraciones de variables y demás.

Espero q me podáis ayudar, gracias!!!

[MadDunDee]

Perdonar, porque veo q no me expliqué bien.

Lo que necesitaría es poder meter todas las funciones que tienen q ir en la call en un objeto y luego lanzarlo desde una función.

Como puedo empaquetar todo ese código y luego realizar la llamada en callback con una simple función??

[doylelives]

Te recomiendo crear una funcion que podria recibir un identificardor del elemento como parametro sobre quien debe realizar su funcionalidad
luego el nombre de dicha funcion es declarada en el parametro del callback del quicksand

Código PHP:

  }, function() { // callback function 
    $('#content a').tooltip(); 
}  
   

Código PHP:

  }, myFunction('idElemento')// callback function  
   

Código PHP:

  function myFunction(id) { 
$('#'+id).hover(   
    function () {   
   
        value = $(this).find('img').outerHeight() * -1;   
           
        $(this).find('img').stop().animate({top: value} ,{duration:200, easing: 'linear'});      
           
    },   
    function () {   
            
        $(this).find('img').stop().animate({top:0} ,{duration:300, easing: 'linear'});       
       
    });   
}  
   

[MadDunDee]

Eso es justo lo que necesito, pero lamentablemente debo de estar haciendo algo mal. Lo he pasado de la siguiente manera:

Código PHP:

  function myFunction(id) {
    $('.hover-fx-fade'+id).hover(function() {  
          
        width = $('.hover-fx-fade').width() * zoom;  
        height = $('.hover-fx-fade').height() * zoom;  
          
        $(this).find('img').stop(false,true).animate({'width':width, 'height':height, 'top':move, 'left':move}, {duration:200});  
          
        $(this).find('div.fx-fade').stop(false,true).fadeIn(200);  
    },  
    function() {  
        $(this).find('img').stop(false,true).animate({'width':$('.fx-fade').width(), 'height':$('.fx-fade').height(), 'top':'0', 'left':'0'}, {duration:100});      
  
        $(this).find('div.fx-fade').stop(false,true).fadeOut(400);  
    }); 
  }  
   

Y el callback en quicksand lo realizo con la llamada a esta función:

Código PHP:

  $('#list-works').quicksand($filteredData, {
        duration: 300,
        easing: 'easeInOutQuad',
        useScaling: true,
        adjustHeight: true,
        timezone: +10,
        }, myFunction('id')  // callback function 

      );  
   

Hay algo q no entiendo y es el tema del id, q supongo q simplemente es el nombre que quiero utilizar para esta función. Pero no entiendo por qué se usa el más y luego el identificador. No se supone que pasandole el nombre de la función simplemente debería de lanzarla?

Siento tantas dudas, pero sobre todo agradezco el interés y la ayuda!! Muchas gracias en cualquier caso!!

[doylelives]

Creo que tu selector esta mal armado

Código PHP:

  $('.hover-fx-fade'+id).hover(  
   

Ejemplo, el siguiente selector busca a un table contenido dentro de un elemento con id igual al contenido en la variable idElement.

Código PHP:

  $('#'+idElement+' >table');  
   

Adaptalo a tu code.

[seik!]

Código:

 $('#list-works').quicksand($filteredData, {
        duration: 300,
        easing: 'easeInOutQuad',
        useScaling: true,
        adjustHeight: true,
        timezone: +10
      },(CALLBACK));

creo que ese el el orden.. ve la diferencia con el tuyo.

saludos

[MadDunDee]

Muchas gracias por vuestra ayuda.

Usando el código de la sigueinte manera, tal y como indicabais antes:

Código PHP:

  $('#list-works').quicksand($filteredData, { 
        duration: 300, 
        easing: 'easeInOutQuad', 
        useScaling: true, 
        adjustHeight: true, 
        timezone: +10, 
        }, myFunction()  // callback function  
 
      );  
   

He conseguido que funcionara, simplemente declarando una función con los eventos que necesitaba realizar y sus funciones. Luego le paso el nombre de la función a quicksand en callback y listo. Working!!

Lamentablemente la lista de items q participan en este espacio de código contienen algunas funciones que parecen no ser compatibles con este plugin, pues unas funcionan y otras no. Así que he decidido utilizar otro sistema. Pero en cualquier caso os agradezco muchísimo vuestra ayuda.

GRACIAS!!!