Re: Anything Slider – removing pagination and seperating show/hide caption

[Mottie]

Hi mkultron!

Sorry it took me a bit to get the demo working since I found a bug in the plugin… so try this demo, but before you try to implement it, update AnythingSlider to the latest version.

I added two options right at the top of the code:

1. toggleTime which is the amount of time it takes to slide up and down.
2. showCaptionInitially when set to true will automatically open the caption when a slide comes into view. When false, it stays hidden until clicked.

    // caption toggle animation time

var toggleTime = 500,

// always show caption when slide comes into view

showCaptionInitially = true,



updateCaption = function(slider, init){

if (init && showCaptionInitially) {

setTimeout(function(){

slider.$targetPage.find('.caption').animate({

bottom: 0

}, toggleTime);

}, slider.options.delayBeforeAnimate + toggleTime);

} else if (!init) {

var cap = slider.$lastPage.find('.caption');

cap.css('bottom', -cap.innerHeight());

}

};



$('#slider').anythingSlider({

infiniteSlides     : false,

animationTime      : 0,

delayBeforeAnimate : 500,

//    buildNavigation    : false,



// *********** Callbacks ***********

// Callback when the plugin finished initializing

onInitialized: function(e, slider) {

slider.$items.each(function(){

var cap = $(this).find('.caption');

cap

.css('bottom', -cap.innerHeight())

.click(function(){

cap.animate({

bottom: (cap.css('bottom') === "0px" ? -cap.innerHeight() : 0)

}, toggleTime);

});

});

updateCaption(slider, true);

},



// Callback before slide animates

onSlideBegin: function(e, slider) {

updateCaption(slider, true);

},



// Callback after slide animates

onSlideComplete: function(slider) {

updateCaption(slider, false);

}



});​