straydogstudio / film_roll

A lightweight jQuery carousel that centers one item at a time on the page.
MIT License
207 stars 60 forks source link

image resize #2

Closed kiul closed 10 years ago

kiul commented 10 years ago

hello your plugin is fantastic, great work is there a way throught the css to have the container on the full page or full browser i mean height: 100% and width: auto i try to set the plugin but it doesn't work

thanks

straydogstudio commented 10 years ago

Thanks.

100% width should work, as it just uses the width of the container, and readjusts itself if the window is resized. So if your container is 100% then you should be ok.

But you are wanting height of 100% with width auto. Can you send me a simple example? A gist? That way I can address your problem specifically.

Noel

straydogstudio commented 10 years ago

@kiul, are you just wanting a full page carousel, whatever the height is?

kiul commented 10 years ago

Sorry for the late I want to have the height responsive when i'm on mobile or on laptop the image height take the full browser

Envoyé de mon iPhone

Le 25 oct. 2013 à 00:22, Noel Peden notifications@github.com a écrit :

@kiul, are you just wanting a full page carousel, whatever the height is?

— Reply to this email directly or view it on GitHub.

straydogstudio commented 10 years ago

@kiul I've done initial work for full screen. You'll find it in the documentation and example page. See if it meets your needs.

It allows a full screen carousel, but it does not try to resize the content for you. It will center it vertically if desired.

If you are wanting each item to be full screen, this is probably not the plugin you need. It isn't designed to fill each screen one item at a time.

straydogstudio commented 10 years ago

I'm going to close this as I've not heard from you.

I should mention, there should be a way to use callbacks, css media queries, and javascript to adjust content at break points.

There is also the possibility of having the plugin force the relative size of the content to fill the container. The problem is there are no stipulations on what a child is; how would non image content be resized? But there might be a way to handle it. Sometime I will do more to play with it. Add another comment if you have any input.

kiul commented 10 years ago

Thanks you for your time

Envoyé de mon iPhone

Le 29 oct. 2013 à 05:18, Noel Peden notifications@github.com a écrit :

I'm going to close this as I've not heard from you.

I should mention, there should be a way to use callbacks, css media queries, and javascript to adjust content at break points.

There is also the possibility of having the plugin force the relative size of the content to fill the container. The problem is there are no stipulations on what a child is; how would non image content be resized? But there might be a way to handle it. Sometime I will do more to play with it. Add another comment if you have any input.

— Reply to this email directly or view it on GitHub.

straydogstudio commented 10 years ago

@kiul FYI, I finally worked out full screen carousels. Or rather, full height carousels that resize with the window. View an example here:

http://straydogstudio.github.io/film_roll/fullscreen.html

I've also made it possible to work with responsive images, but I haven't had time to post an example yet. Tell me if you'd like to know when it is up.

kiul commented 10 years ago

hello, i'm currently in vacation but i try a little bit on safari it works fine and for a better increase in size : div.film_roll_child img { width:auto; height: 100%; max-width: none; max-height: 100%;} in adding width: auto, it works very well try your code with real images or photos, you'll understand thanks a lot

straydogstudio commented 10 years ago

Thanks @kiul. I'll look at that CSS.