Make royalSlider break in a more responsive way (according to bootstrap grid)

Owen's Avatar


20 Nov, 2013 09:47 AM

I loved your feature, for visibleNearBy layout, that breaks the view at a certain width.

yet, we use bootstrap's grid system so we wanted the center view to 'break' in certain resolutions,
and that it'll keep this width until the next breaking point.

basically, we wanted RS to keep the same width as the 'container' element in bootstrap.

I believe it's an important feature, needed by many websites.

I'm sharing the code snippet, and I hope you'll integrate it (or similar functionality) on the main RS branch.


on function self.ev.on('rsAfterSizePropSet', function() ...
... comment and use 
/* if(o.breakpoint && self.width < o.breakpoint) {
                    centerRatio = o.breakpointCenterArea;
                } else {
                    //centerRatio = o.centerArea;
                    centerRatio = 1170 / self.width ;
                } */
                if (o.breakpoint) {
                    if (self.width < 768) {
                        centerRatio = o.breakpointCenterArea;
                    } else if (self.width < 992) {
                        centerRatio = 768 / self.width ;
                    } else if (self.width < 1170) {
                        centerRatio = 992 / self.width ;
                    } else {
                        centerRatio = 1170 / self.width ;
  1. Support Staff 1 Posted by Dmitry Semenov on 20 Nov, 2013 12:00 PM

    Dmitry Semenov's Avatar
  2. 2 Posted by Owen on 20 Nov, 2013 01:33 PM

    Owen's Avatar

    thanks for your fast reply.

    it won't give me the same functionality, like centering the activeImage.
    with the code snippet i attached before it does work..

    it's an enhancment, so if you wanna include it you're surely welcome.
    it just makes RS behave similar to Bootstrap's grid system

  3. Support Staff 3 Posted by Dmitry Semenov on 20 Nov, 2013 07:12 PM

    Dmitry Semenov's Avatar

    Oh, thank you very much, I somehow completely missed that you're sharing your solution. I'll make the discussion public (if you don't mind), it'll very likely help other devs.


  4. 4 Posted by Owen on 21 Nov, 2013 07:49 AM

    Owen's Avatar


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