Ticker doesn't stop on mouse hover in IE11

[01Kuzma]

Hi! It seems that it's a bug. In IE 11 once the mouse is hovered over the ticker - the ticker returns to the first logo. No way to click to the others. The example is placed here: http://tedxmru.com/#partners

Another issue: you have already helped me with full screen logo. But it seems, after the bxslider's update to the latest dev version something went wrong. There is a little margin on the right. The slide doesn't cover the width by 100%. Example at the beginning of the page: http://tedxmru.com

Version: v4.2.3

Thank you!

[Tidal-Wave]

Hey, I'm currently unable to open your page, the server returns not found.

Also, I've pushed 4.2.4 to master if you would like to properly update.

[01Kuzma]

Hi! There was a malfunction on hosting. Now the website is online. I've updated the library but everything remained the same :(

[Tidal-Wave]

It looks like the issue with the right side of your slider isn't directly related to bxSlider, and actually related to your custom scrollbar. Not real sure on how to assist in this, as it's specific to your implementation.. What are you using for custom scrollbars?

There does seem to be a bug in IE11 for the tickerHover feature. I will look at that. For now I think you can set the ticker to useCSS:false to get around this. I believe there is an issue calculating the transform position.

[01Kuzma]

Hm... I've disabled mostly all of CSS code on my localhost but margin hasn't disappeared... I use Infinite jQuery Scroll & jQuery ScrollTo. But few weeks ago everything was fine... Strange, I can't find the relation, what's causing the problem :(

Ok, thank you! I will use it as a temporary workaround

[01Kuzma]

I think that I've found what is causing the margin problem - it's second slider with logo ticker (are they conflicting somehow?). If I remove it from HTML and from JS - the margin disappears, but I still don't have a clue why it's so happening. I'm using this code to initialize both sliders:

( function( $ ) {

    // Setup variables
    $window = $(window);
    $slide = $('.homeSlide');
    $body = $('body');

    //FadeIn all sections   
    $body.imagesLoaded( function() {
        setTimeout(function() {

              // Resize sections
              adjustWindow();

              // Fade in sections
              $body.removeClass('loading').addClass('loaded');

        }, 800);

        $('.bxslider').bxSlider({
            auto: true,
            easing: 'ease',
            controls: false,
            pager: false 
        });   

        $('.logos').bxSlider({
          minSlides: 2,
          maxSlides: 3,
          slideWidth: 250,
          slideMargin: 10,
          moveSlides: 3,
          ticker: true,
          tickerHover: true,
          speed: 20000
        });
    });

    function adjustWindow(){

        // Get window size
        winH = $window.height();
        winW = $window.width();

        // Keep minimum height 550
        if(winH <= 550) {
            winH = 550;
        }

        // Init Skrollr for 768 and up
        if( winW >= 768) {

            // Init Skrollr
            var s = skrollr.init({
                forceHeight: false
            });

            // Resize our slides
            $slide.height(winH);

            s.refresh($('.homeSlide'));

        } else {

            // Init Skrollr
            var s = skrollr.init();
            s.destroy();
           $slide.height(winH);
        }

        // Check for touch
        if(Modernizr.touch) {

            // Init Skrollr
            var s = skrollr.init();
            s.destroy();
        }
    }

    function initAdjustWindow() {
        return {
            match : function() {
                adjustWindow();
            },
            unmatch : function() {
                adjustWindow();
            }
        };
    }

    enquire.register("screen and (min-width : 768px)", initAdjustWindow(), false).listen(100);

} )( jQuery );

[01Kuzma]

I've spent more time digging in the margin's problem and what I've investigated - is very interesting and weird. I think it's very specific bug: if the number of logos exceeds 10 images - the margin appears! While the are ten of less logos - everything works fine...

[01Kuzma]

Updated to 4.2.5 - everything is the same :(

[anteloff]

I had the same issue, this "useCSS:false" helped me to fix it.