How to hide the slider on mobile?

In this documentation

Hide the slider on mobile
Show different slider for mobile and desktop

Hide the slider on mobile

Pro version

You can hide the slider for mobile devices at the Slider settings → Size tab using the Hide on feature.

Free version

In the free version, you can hide the slider with custom coding using Media Queries:

E.g.:

@media only screen and (max-width: 440px) {
    div#n2-ss-4, div#n2-ss-4-placeholder {
        display: none;
    }
}

where the 4 in n2-ss-4 is your slider id. You can put this code to your theme's CSS file or use a plugin like Simple CSS, which will create an option for you in the WP left admin menu’s Appearance → Simple CSS.

Show different slider for mobile and desktop

Pro version

You should hide one of your sliders on mobile, and the other one on desktop and tablet. Then publish the two sliders below each other.

You can hide the slider at the Slider settings → Size tab using the Hide on feature.

Free version

Publish the two sliders below each other and use media Media Queries to show or hide the slider on different browser widths.

div#n2-ss-4 {
  display: block;
}
div#n2-ss-5, div#n2-ss-5-placeholder {
  display: none;
}

@media only screen and (max-width: 440px) {
  div#n2-ss-4, div#n2-ss-4-placeholder {
    display: none;
  }
  div#n2-ss-5 {
    display: block;
  }
}

where the 4 in n2-ss-4 and 5 in n2-ss-5 is your slider id. The code above will make the #4 slider show up on screens wider than 441px and the #5 slider will be displayed on 440px screens and below.

☝️ Note: The example code above only applies to the screen width. You will need to do custom coding if you want to fine-tune the Media Queries to detect landscape and portrait screen sizes. Please note that we're not able to provide any kind of support for custom coding.

You can put this code to your theme's CSS file or use a plugin like Simple CSS, which will create an option for you in the WP left admin menu’s Appearance → Simple CSS.