Question

I need a click on the .next button in jQuery serialScroll/scrollTo to not only slide to the next item but to make an ajax call for new content before doing so. What is the best way to get an ajax call onto the .next button in serialScroll?

Here’s the serialScroll stuff;

$('.audioholder').serialScroll({
target:'.scrollable',
items:'.newthing',
prev:'img.prev',
next:'img.next',
cycle:false,
axis:'x',
duration:700,
force:true,
lazy:true,
});

And the ajax code:

        var target = $(this).closest('.newthing').next('.newthing');
        var toLoad = Drupal.settings.basePath + 'replies/' + mynid;
        xhr = $.ajax({
            url: toLoad,
            success: function(data) {
        $(target).html(data);

        });
        return false; 

Answer 1

Well maybe it’s not ideal but I ended up using scrollTo instead.

Here’s for the click on the next button:

var myscrollable = $(this).closest('.scrollable');
myscrollable.scrollTo(target, 800 );

And the code for the previous button:

var mynewthing = $(this).closest('.newthing');
var prevthing = mynewthing.prev(); 
var myscrollable = $(this).closest('.scrollable');
myscrollable.scrollTo(prevthing, 800);