slick kills my background-attachment

Hi! I know i have to provide a demo, but i couldn’t reproduce the issue with less sources. But i have the site online, so you can take a look this page. At the third section should a fixed background-image be displayed. In all major browser and os except chrome it works like a charm.

i’ve tried all the known fixes for this bug like:

backface-visibility: hidden; -webkit-perspective: 1000; -webkit-transform: translate3d(0, 0, 0); -webkit-transform: translateZ(0);

Could you please take a look at even i didnt follow you guidlines?

A link to your production site is not a reduced test case.

Thanks for any help and greate plugin!

[mmdonaldson]

Hi all, I am actually also having this problem. I assume the PR was never created?

[killianmh]

Slick.js uses transforms to smoothly move slides which create a new stacking context. See this discussion for an explanation.

I get around this issue first by manually removing the transform3d css on the slick-track and slick-list elements (parallax in Firefox won’t work without this) and then by setting fade: true in the slick settings:

$(“.mySlider”).on(“init”, function(event, slick){ $(this).find(“.slick-list”).css(“transform”, “none”); $(this).find(“.slick-track”).css(“transform”, “none”); }) $(“.mySlider”).slick({ fade: true, });