wrapAround and Parallax

[berengerzyla]

Hi! There is an issue when activating both wrapAround and parallax. The overall project works, but parallax values are incorrect for the edges, making the first-1 and last+1 pictures not to show while scrolling (they will appear once the scroll is over).

Test case: http://codepen.io/iambz/pen/XjZVRX

[desandro]

Thanks for this feature request. Add a 👍 reaction if you'd like to see this feature added to Flickity.

[dmegatool]

How nice that would be !! Best looking carousel ever ;) ... Would need it like right now.

[proeung]

Hi! @desandro Any updates on when this particular feature will be available?

[mark-8]

Something like this should help. Improvements welcome :)

$(this).on( 'scroll.flickity', function() {
	flkty.slides.forEach( function( slide, i ) {
		var img = $imgs[i],
			x   = 0;

			if( 0 === i ) {
				x = Math.abs( flkty.x ) > flkty.slidesWidth ? ( flkty.slidesWidth + flkty.x + flkty.slides[flkty.slides.length - 1 ].outerWidth + slide.target ) : ( slide.target + flkty.x );
			} else if( i === flkty.slides.length - 1 ) {
				x = Math.abs( flkty.x ) + flkty.slides[i].outerWidth < flkty.slidesWidth ? ( slide.target - flkty.slidesWidth + flkty.x - flkty.slides[i].outerWidth ) : ( slide.target + flkty.x );
			} else {
				x = slide.target + flkty.x;
			}
		img.style[ transformProp ] = 'translateX(' + x * ( -1 / 3 ) + 'px)';
	});
});

Adjusting the test case gives - https://codepen.io/anon/pen/WORpwx

[JessePimenta]

Still getting this flash when using wrapAround with parallax. Any hope for this issue?

Almost fixed by adding a slight transition to the transform prop on a cell, but then the parallax begins to look weird.