basilio / responsiveCarousel

Simple carousel
MIT License
113 stars 64 forks source link

Navigation controls mess up within in grid #10

Open dlzi opened 11 years ago

dlzi commented 11 years ago

Hi Basilio,

The carousel controls don't play nice when they are inside a grid. The controls take the parent width instead of the carousel one.

You can see here http://begun.theux.co/

Cheers.

basilio commented 11 years ago

Hi Daniel, There are two issues in your example:

  1. There are not a style relation between both elements. This allows you to create more flexible galleries, with the css style that you wants. I think this is better for develop complex desings.
  2. Pictures from your gallery probably need to have full width. This works adding the class="wide-image" to everyone, or passing a new variable called 'imageWideClass' that allows you to specify the classname: http://screencloud.net/v/dct5

Cheers

dlzi commented 11 years ago

Hi Basilio,

Sorry, but I didn't understand your answer.

I use this grid https://github.com/arnaudleray/pocketgrid. Once I'm out of the grid, things are okay. So, are you saying the problem IS the grid or is it not? Could you please clarify your answer?

Cheers

basilio commented 11 years ago

Hi Daniel, Is simpler, What I say is that what you mention is not a bug, it's part of the behavior of the gallery. There are not a style relation between both elements: .crsl-nav and .crsl-items. Both elements have width 100% in relation to its container. Thats one thing.

Secondly, each image inside a .crsl-item has not full-width by default. For doing this, you need to add the class wide-image on each that you what. Add this class and all will works fine.

Bye

dlzi commented 11 years ago

Hey,

Ah.. ok.. it's getting clear now.

One question. Do I add the class wide-image on the element that wrap the image (section in my case) or do I add on the img it self?

Thanks.

basilio commented 11 years ago

In the img. This was a update in the last version, to have more control of inside elements of each crsl-item (for example, if you need multiples images inside each crsl-item), but if it will be a permanent bug, i will to rollback the change. ;)

dlzi commented 11 years ago

I see that. Hummm it can be a problem for me. It will make harder to use the carousel for example with WordPress plugins and maybe for other CMS too.

What you could do is to make the imageWideClass boolean. So, if the user sets it to true you can have a javascript finding the img and applying the CSS class. What do you think?