AnythingSlider is undefined

Question

I'm using the AnythingSlider jquery plugin for a photogallery and I'm having some problems in customizing it.

The slider works, but right now I want to show the current slide number and the total number and I'm getting an error in Firebug.

The script is this:

$(function() {

var current = $('#gallery').data('AnythingSlider').currentPage;
var pages = $('#gallery').data('AnythingSlider').pages;
$('.slides').append(current + '/' + pages);

$('#gallery').anythingSlider({
    appendBackTo: '.arrow-left',
appendForwardTo: '.arrow-right',
buildNavigation: false,
buildStartStop: false,
easing: 'linear',
resizeContents: false
    //expand: true
})
});

Without the first 3 lines it works, but with that Firebug says $("#gallery").data("AnythingSlider") is undefined.

Answer 1

It is because data('AnythingSlider') is not available before the plugin initialization, so just place your following lines

var current = $('#gallery').data('AnythingSlider').currentPage;
var pages = $('#gallery').data('AnythingSlider').pages;
$('.slides').append(current + '/' + pages);

bottom of these lines

$('#gallery').anythingSlider({
    appendBackTo: '.arrow-left',
    appendForwardTo: '.arrow-right',
    buildNavigation: false,
    buildStartStop: false,
    easing: 'linear',
    resizeContents: false
   //expand: true
});

If everything else is right then it should work. data('AnythingSlider') will be available only when the plugin will be initialized because these data will be added by this plugin and until then these data are undefined.