OWL carousel from demo-landing does not support swipe on mobile

2 replies · opened Apr 18, 2023

Yyellow8Apr 18, 2023

Hey there,

I built a new website for my mobile app, based on the demo-landing. So far so good, except for the 'App screenshots' section:

  • mobile: not possible to swipe left or right to change the main screenshot
  • desktop/mobile: when you click on the screenshot, ain't it supposed to zoom on the image? Or move the carousel to change the main image?
    The little buttons at the bottom are too small to provide a great UX.

What can I do about that?
Thanks!

SSemicolon WebSTAFFApr 18, 2023

Hello,

On this particular demos, ie. demo-landing.html, the Left/Right swiping is not supported due to the Mobile Phone BG added on top of the Carousel to provide that effect. If you would like to enable this functionality, you will need to:

  1. Remove the following code:
    [ch_pre]
    jQuery(window).on( 'pluginCarouselReady', function(){
    setTimeout( function(){
    jQuery('.owl-stage').after('');
    }, 1000 );

    });
    [/ch_pre]

  2. Make your Images pre-photoshopped with the Mobile BG for all the Images to get that effect and then you can swipe Left/Right through the Images.

  3. To enable Zoom or add a Lightbox, you will need to add the Lightbox on the Image manually. Consider checking this Documentation: https://docs.semicolonweb.com/docs/shortcodes/lightbox/ .

Hope this Helps!

Let us know if we can help you with anything else or if you find any further issues.

Have the same question, or something new?

Sign in to the Canvas dashboard to reply or open your own topic. Canvas owners get direct help from the SemiColonWeb team.

Reply on the dashboard