Skip to content

HTTPS clone URL

Subversion checkout URL

You can clone with
or
.
Download ZIP

Loading…

Ajax added slides flash above current slide #1023

Closed
GTVJones opened this Issue · 0 comments

2 participants

@GTVJones

When loading slides via Ajax, the loaded slide briefly flickers above the current slide. I've pinpointed the cause to lines 875 and 876 (shown below).

methods.uniqueID( slider.slides.first().clone().addClass('clone').attr('aria-hidden', 'true') ).appendTo( slider.container );
methods.uniqueID( slider.slides.last().clone().addClass('clone').attr('aria-hidden', 'true') ).prependTo( slider.container );

It may be relevant that I'm using CSS background images rather than inline content. All attempts to fix this have been unsuccessful.

HTML structure is:

  • JavaScript that initializes Flexslider is:

    $(window).load(function () {
    $('.flexslider').flexslider({
    animation: "slide",
    slideshow: false,
    touch: true,
    useCSS: false,
    start: function (slider) {
    $('body').removeClass('loading');
    $.makeAjaxRequest(slider);
    },
    after: function (slider) {
    // Creating the slider - definition shown below
    $.makeAjaxRequest(slider);
    },
    before: function () {
    $('.details').removeClass('shown');
    }
    });

    $.makeAjaxRequest = function (slider) {
    if (!!window.next_link) {
    if (!window.currentlyAwaitingAjaxResponse) {
    window.currentlyAwaitingAjaxResponse = true;
    $.ajax({
    url: window.next_link
    }).done(function (data) {
    li = $.prepareSlideFromJSON(data);
    $('.slides').append(li);
    slider.addSlide(li);
    window.currentlyAwaitingAjaxResponse = false;
    });
    }
    }
    }

    @jeffikus jeffikus closed this
    Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
    Something went wrong with that request. Please try again.