Srcset example with webp and jpg

info's Avatar


12 Nov, 2018 01:25 PM

Is there a working demo of Royal Slider with srcset? Preferable with webp and jpg fallback? Any luck with implementing Lazy Sizes from Farkas?
Regards & Thanks,

  1. Support Staff 1 Posted by Dmitry Semenov on 12 Nov, 2018 02:09 PM

    Dmitry Semenov's Avatar


    You may add IMG or PICTURE element to the slider without rsImg class, it will work the same way as it's added to the page. Use CSS to position/center image, for example:

    To make it work with scripts like lazysizes you may use slider API and events like rsAfterSlideChange, e.g.:

    var slider = $(".royalSlider").data('royalSlider');
    slider.ev.on('rsAfterSlideChange', function(event) {
        console.log( slider.currSlide.content[0] ); // contents of the current slide

    But I'd recommend to just generate image/picture element dynamically, as shown at

Reply to this discussion

Internal reply

Formatting help / Preview (switch to plain text) No formatting (switch to Markdown)

Attaching KB article:


Attached Files

You can attach files up to 10MB

If you don't have an account yet, we need to confirm you're human and not a machine trying to post spam.

Keyboard shortcuts


? Show this help
ESC Blurs the current field

Comment Form

r Focus the comment reply box
^ + ↩ Submit the comment

You can use Command ⌘ instead of Control ^ on Mac