Slider settings - Developer

The Developer tab is located at the Slider settings page.

Block right click - Pro

You can block the right clicking in your slider.

Block carousel

When enabled, it blocks carousel when the source of interaction is vertical touch, vertical pointer, mouse wheel or vertical keyboard. As a result, you'll be able to reach the content below the slider.

☝️ Note: The Block Carousel options is only visible if the Carousel option is enabled at Slider settings → Animations tab. If the Carousel is disabled at the Animation tab the Block Carousel behaves as "enabled".

Clear before

Closes the unclosed float CSS codes before the slider. Unclosed float tags could create a problem with the slider's initial size calculations, also when you resize your browser the slider might won't change it's width

Clear after

With a clear:both; we are putting contents following the slider under the slider. If your slider's width doesn't fill up the entire row of its placement, you can turn this option off to let the rest of your contents, like texts coming into the same row the slider is in. But probably you will still need to write your own custom CSS codes to make your text look the way you want it to!

Your slider needs to have Boxed layout, with the Upscale turned off. If you use Carousel type the Align needs to be left (or right).

Hide scrollbar

In rare cases the Full page responsive mode can result a wrong calculation and leave out the space for the scrollbar. Turn on this option to remove that empty space!

⚠️ Warning: Your website won't be scrollable anymore! All out of screen elements will be hidden!

Scroll to slider

Makes the page scroll back to the slider, even if just a small part of the slider was visible when the slides are switching. (E.g. when an arrow or bullet is clicked.)

  • Auto: Scrolls back to the closest edge of the slider.
  • Top - when needed: Scrolls back to the top of the slider, when the slider isn't fully visible or doesn't fill the screen.
  • Top - always: The page scrolls to the top of the slider, when the page isn't there.
  • Bottom - when needed: Scrolls back to the bottom of the slider, when the slider isn't fully visible or doesn't fill the screen.
  • Bottom - always: The page scrolls to the bottom of the slider, when the page isn't there.
Delayed (for lightbox/tabs)

Turn on this option if you are using the slider in a tabbed environment or in lightbox. This option will give a +200ms delay to the slider load, and it will keep checking if the slider is currently visible to adjust its size so the slider can appear correctly in a tab or in a lightbox.

Legacy font scale

Enables the non-adaptive font size for Absolute layers which were made before version 3.5. It doesn't affect newly created Absolute layers.

⚠️ Warning: Turning Legacy font scale on can affect website performance, so we suggest to keep it disabled and rather adjust the slides so you won't need to turn it on.

Slider CSS classes

You can put custom CSS classes to the slider's container. Separate your classes with a single comma.

CSS

⚠️ This option was created for developers!

To be able to use this option, you're required to have coding knowledge. If you're not a developer and can't achieve what you're looking for, consider hiring a developer.

Make sure to write correct code. Also, please note that we're unable to provide help with custom coding, or the possible issues that are happening because of them.

You can add custom CSS codes to your slider. E.g.:

#selector{

background-color: red;

}


JavaScript callbacks

⚠️ This option was created for developers!

To be able to use this option, you're required to have coding knowledge. If you're not a developer and can't achieve what you're looking for, consider hiring a developer.

Make sure to write correct code. Also, please note that we're unable to provide help with custom coding, or the possible issues that are happening because of them.

You can put some JavaScript codes here, which will be triggered after the slider loaded.

Loading animation waiting time

You can set the time the loading animation waits before appearing. If you don't want to see the loading animation at all, set a large value, like 10000MS . This means the loading animation will only appear if your slider needs more than 10 seconds to appear.

This option only affects the loading animation on page load, but doesn't affects the loading animation of lazy loaded images. If you want to hide the loading animation at your lazy loading too, you should use this CSS code:

ss3-loader{

display:none!important;

}


You could insert this code for example into the CSS field.

Post IDs (one per line)

The cache of the posts with the given ID will be cleared when you save on this slider. It's useful when you have a caching plugin on your site as this way you can keep the page and slider in sync.

Fallback slider

If you dont have any slides in your slider, this slider will show up. You can write down the ID number or Alias of the given slider.

Did this answer your question? Thanks for the feedback There was a problem submitting your feedback. Please try again later.