Stops working on mobile after a few slides – rev slider

Home Forums Easy FancyBox Pro Stops working on mobile after a few slides – rev slider

This topic contains 6 replies, has 3 voices, and was last updated by  Pharéo 3 weeks, 1 day ago.

  • Author
    Posts
  • #11627

    Charisa Richardson
    Participant

    Hi,

    I hope your day is going well! I’m using this feature with the revolution slider, but on mobile it causes issues. After you scroll on revolution slider through the first few images, they turn white. I can still click on the image and it shows it in lightbox but I need it to work with both. http://2017.rembrandtyard.com/weddings/

    When I deactivate the plugin it issue goes away. After initially deactivated and reactivating, it started working  but then stopped again.  I’ve checked chrome and Safari.

    Any thoughts?

    Thanks!

    Here is a screenshot

     

  • #11628

    RavanH
    Keymaster

    Hi Charisa,

    I can reproduce the issue on your site on mobile and on Chrome desktop with the developer tools open and mobile view activated. Even when first opening in normal desktop view, browsing the revslider and then half-way switching to small screen view, it appears to be happening. But I do not see why. There are no errors in console.

    Apparently after a certain number, images are loaded loaded through ajax request but on small screen the request gets blocked.

    Could you temporarily remove the custom “revapi” script that you added to the slider? It will obviously break the interaction between fancybox and revslider but I’d like to see if it restores mobile slide browsing…

    One other thing I noticed is there seems to be some fancybox style rules in the theme stylesheet that conflict with the fancybox stylesheet. I wonder if there is other fancybox related javascript in the theme script files somewhere that could be interfering here.

    To fix the fancybox rotating loading icon looking badly, you might want to add this to the Custom CSS theme option to make the loading icon look better:

    #fancybox-loading div { background-position: top left; }

  • #11630

    Pharéo
    Participant

    UPDATE: it appears the issue occurs on normal desktop screen too. At least with a cleared browser cache and when browsing the slider just a little further than on mobile… Are you sure this is related to Fancybox?

  • #11634

    Charisa Richardson
    Participant

    Hi,

    Thanks so much for all the input! So yes we did also discover that the issue is happening on Safari desktop as well.

    I deactivated the script on this gallery http://2017.rembrandtyard.com/weddings/ and now it’s working on mobile and on safari desktop. Let me know what you discover and if you’d like login.

    ** Thanks for the css tip! I added it.

  • #11638

    RavanH
    Keymaster

    Hi Charisa, the issue still occurs on Chrome from my end. Strangely, it does work fine sometimes (all images are showing) but most times not. Each time I visit with the developer tool bar open and the option “disable cache” checked to avoid seeing a cached version of the site.

    I’m not sure what this means but could you set the Lazyload type option to “none” in the Revslider settings? I think it’s done on slider level, not the general settings. And maybe completely disable Easy FancyBox to make sure there is no remaining conflict?

     

  • #11639

    Charisa Richardson
    Participant

    Hi. Thanks so much! Disabling the lazyload seemed to do the trick. I appreciate all your help!!

  • #11649

    Pharéo
    Participant

    Hi again, you might want to try different lazyload settings. Completely disabling lazyload is a bit sad as you will cost a lot in respect to page load time and bandwidth consumption. Only if none of the available options work good, then the only one remaining is “none”…

    Good luck and if you have the time, please let us know 🙂

You must be logged in to reply to this topic.

Site by Pharéo | Hosted on The Permanently Moving Network