Materialize: Carousel with .carousel-slider only shows half of the image

Created on 3 Feb 2016  路  4Comments  路  Source: Dogfalo/materialize

Here is a plunk using the carousel from your website:
http://plnkr.co/edit/6cJYKdtniiTUfLib47EA?p=preview

The image is 400px in height but only shows about the half of it.
I guess it is because of: https://github.com/Dogfalo/materialize/blob/master/js/carousel.js#L97

alignment += 'translateY(' + (view[0].clientHeight - item_width) / 2 + 'px)';

Setting translateY(0) in chrome debugger fixes this. Also, there is no translateY set in the example on Materialize website.

As you might have guessed, images with same height/width display correctly.

Most helpful comment

Use this an get lucky. :)

$('.carousel').carousel({full_width: true});

All 4 comments

Use this an get lucky. :)

$('.carousel').carousel({full_width: true});

Yeah, why not. :smile:

Anyway, nice workaround but I guess this could still get fixed. I'm just not sure if my assumption is correct. If I were sure, I'd commit a PR. :smile:

Fixed in bb5dd21

I wanted to have carousel for cards . Is there any way to obtain it

Was this page helpful?
0 / 5 - 0 ratings

Related issues

locomain picture locomain  路  3Comments

ReiiYuki picture ReiiYuki  路  3Comments

ruslandzhumaev picture ruslandzhumaev  路  3Comments

bradley-varol picture bradley-varol  路  3Comments

artur99 picture artur99  路  3Comments