search

stevenwanderski / bxslider-4

Responsive jQuery content slider
Other
4.22k stars 1.86k forks source link

Blurred slide with ticker mode on Chrome. #1291

Open ShamimWP opened 3 years ago

ShamimWP commented 3 years ago

The slide items get blurred on the Chrome browser when Ticker mode is on. Tried with the following versions but no difference – 4.2.1d 4.2.12 4.2.15

Help will be appreciated.

bachirdiopmodus commented 3 years ago

Hello Shamim Did you find any solution to this issue ?

ShamimWP commented 3 years ago

I used a CSS hack to fix this issue– .item-selector { backdrop-filter: blur(0); }

bachirdiopmodus commented 3 years ago

I used a CSS hack to fix this issue– .item-selector { backdrop-filter: blur(0); }

Thanks for the help i will try it

chrispage1 commented 3 years ago

Same issue here - it's on a slider that's been there for years and suddenly started occurring. I think this is a new issue with a recent Chrome update.

bennetsadyba commented 3 years ago

Hi, I got it to work in case anybody has the same problem.

Add a class to your CSS: .bx-fix{will-change: transform;}

than in your js code, where you invoke the slider, add: onSlideBefore:function ($slideElement, oldIndex, newIndex) { $(".bx-mtm").addClass('bx-fix'); }, onSlideAfter:function ($slideElement, oldIndex, newIndex) { $(".bx-mtm").removeClass('bx-fix'); }

where .bx-mtm is my slider wrapper class.