Image carousel with no gaps

wouter.denboer's Avatar

wouter.denboer

20 Aug, 2012 11:04 AM

Hi,

I was wondering if it is possible to make an responsive image carousel where the images are next to each other with no gaps/space between them . If so, could you give some tips how to make this?

  1. Support Staff 1 Posted by Dmitry Semenov on 20 Aug, 2012 11:29 AM

    Dmitry Semenov's Avatar

    Hi,

    It depends on what type of carousel do you need. There is slidesSpacingoption that controls spacing between slides.

    Draw a quick mockup of how slider should look like and I'll tell you is it possible or not.

    Dmitry

  2. 2 Posted by wouter.denboer on 20 Aug, 2012 11:50 AM

    wouter.denboer's Avatar

    Thanks for your response!

    Something like this http://imageshack.us/photo/my-images/69/carousel.png/

    So the images are right next to each other and visible.

    (The two black bars are a header and footer)

  3. Support Staff 3 Posted by Dmitry Semenov on 20 Aug, 2012 12:00 PM

    Dmitry Semenov's Avatar

    Well, you may put multiple images inside one slide. (but don't forget that only one image in slide can be with class rsImg).

    Or you may also fill with image full slide area, so it'll look like this http://dimsemenov.com/plugins/royal-slider/visible-nearby/

    Dmitry

  4. 4 Posted by wouter.denboer on 20 Aug, 2012 03:39 PM

    wouter.denboer's Avatar

    Thanks for the suggestions.

    Yes, the visible nearby example is good but I would like the images to be right next to each other with no space between them. This is difficult I guess?

  5. Support Staff 5 Posted by Dmitry Semenov on 20 Aug, 2012 04:13 PM

    Dmitry Semenov's Avatar

    All slides must have same width.

    If your images have same width so it's very easy to do, just disable spacing between slides and set proper slider dimensions.

    Dmitry

  6. Dmitry Semenov closed this discussion on 21 Aug, 2012 02:04 PM.

  7. wouter.denboer re-opened this discussion on 22 Aug, 2012 03:05 PM

  8. 6 Posted by wouter.denboer on 22 Aug, 2012 03:05 PM

    wouter.denboer's Avatar

    Sorry to bother you again. What I am basically looking for is something like your TouchCarousel plugin (http://dimsemenov.com/plugins/touchcarousel/#carousel-gallery example 2) but responsive so images can scale. Would this be possible with RoyalSlider?

  9. Support Staff 7 Posted by Dmitry Semenov on 22 Aug, 2012 03:23 PM

    Dmitry Semenov's Avatar

    Unfrtunately, no. With RoyalSlider all slides must have same width and can be scrollable only one-by-one.

    Dmitry

  10. 8 Posted by wouter.denboer on 23 Aug, 2012 06:44 PM

    wouter.denboer's Avatar

    Ok thanks again for your answer. My images are all the same width and scrollable one by one is no problem. I just want them next to each other with no space so you can see multiple images in the container and scaled according to the container height.

  11. Support Staff 9 Posted by Dmitry Semenov on 24 Aug, 2012 07:10 AM

    Dmitry Semenov's Avatar

    Remove hidden overflow CSS property from rsOverflow. You'll start seeing nearby slides, that's all what you can do.

    Dmitry

  12. 10 Posted by wouter.denboer on 24 Aug, 2012 12:00 PM

    wouter.denboer's Avatar

    Alright, thank you.

  13. Dmitry Semenov closed this discussion on 24 Aug, 2012 12:49 PM.

Comments are currently closed for this discussion. You can start a new one.

Keyboard shortcuts

Generic

? 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