Question

Using flexslider (carousel mode) and Internet Explorer 11, the ghost (blinking images outside of viewport) apeears. Initialization code is as following:

    $('.gallery-block .flexslider').flexslider({
        animation: 'slide',
        slideshowSpeed: 5000,
        animationSpeed: 2000,
        animationLoop: true,
        itemWidth: 214,
        itemMargin: 30,
        minItems: 3,
        maxItems: 4,
        controlNav: false,
        pauseOnHover: false,
        slideshow: true,

        _end_of:"args"
    });

Any ideas?

Was it helpful?

Solution

It seems to be a problem occurs when using CSS3 transition with IE11.

The problem is resolved by disabling CSS3 feature of Flexslider:

useCSS

useCSS allow users to override using CSS3 for animation. Translate3d still has numerous bugs that can crop up and wreak havoc, so this is a great property to play with if you are experiencing unexplainable issues in Webkit browsers.

from: https://github.com/woothemes/flexslider

Just testing whether browser is IE11, and passing useCSS: false to jQuery.flexslider(), it solved.

Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top