Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

box-shadow always gets larger and larger on effect 'fade'

See original GitHub issue

This is a bug.

Swiper Version: 4.3.5
Platform/Target and Browser Versions: macOS
Live Link or JSFiddle/Codepen or website with isssue: https://codepen.io/SilencerWeb/pen/XPpdvO

Expected Behavior

box-shadow should be always the same and it should not get larger on every slide

Actual Behavior

box-shadow gets larger and larger on every slide

Issue Analytics

State:
Created 5 years ago
Comments:8 (1 by maintainers)

Top GitHub Comments

2reactions

nolimits4webcommented, Sep 13, 2018

fadeEffect: {
    crossFade: true
},

0reactions

SilencerWebcommented, Sep 14, 2018

@kukac7, @nolimits4web yup, this works 😃

Top Results From Across the Web

3 ways to style CSS box-shadow effects - LogRocket Blog

Websites have to look and feel realistic, and shadows play a big part. In this post, we'll look at the box-shadow CSS property...

CSS Box Shadow - CSS-Tricks

The blur radius (optional), if set to 0 the shadow will be sharp, the higher the number, the more blurred it will be....

How to animate box-shadow with silky smooth performance

Short answer: you don't. Animating a change of box-shadow will hurt performance. There's an easy way of mimicking the same effect, however, with ......

box-shadow - CSS: Cascading Style Sheets - MDN Web Docs

The larger this value, the bigger the blur, so the shadow becomes bigger and lighter. Negative values are not allowed. If not specified,...

Designing Beautiful Shadows in CSS - Josh W Comeau

The vertical offset is always 2x the horizontal one. Two other things happen as the card rises higher: The blur radius gets larger....