Search code examples
jqueryfunctioncallbackjcarousel

Jquery - Why is the JS dead on this after i add these lines?


Im trying to do a callback in jcarousel where after an image becomes visible it fires this function.

alas soon as i try it it stops the js working and nothing occurs.

can anyone point out what could be wrong?

cheers,

<script type="text/javascript">
jQuery(document).ready(function() {
    jQuery('#mycarousel').jcarousel({
    easing: 'backout',
        animation: 1000,
    vertical: true,
        scroll: 1,
    itemVisibleInCallback: {onBeforeAnimation: itemVisibleIn}, 
       });
});

function itemVisibleIn(){
    $("#gallerydescription").html( $(this).attr("alt"));  }, 
  function () {
    $("#gallerydescription").html("");
  }
);
 });
}

 </script>  

http://sorgalla.com/projects/jcarousel/ <-- documentation


Solution

  • OK, I probably see what's problem here. It should work:

    jQuery(document).ready(function() {
      jQuery('#mycarousel').each(function(){
        $(this).jcarousel({
          easing: 'backout',
          animation: 1000,
          vertical: true,
          scroll: 1,
          itemVisibleInCallback: {
            // this line binds actual element ("this" from actual function)
            // as "this" for callback function
            onBeforeAnimation: function(){ itemVisibleIn.apply(this,arguments); }
          }
        });
      });
    });