Set Lottie to "cover" on web player-CodePudding

I'm trying to create a background animation that uses a lottie that will behave like an image set to "cover" - i.e. it will crop the image as the page is resized so that it remains 100% of the height of the view.

https://codepen.io/michaelzero00/pen/KKXJjOg

I expected

preserveAspectRatio="xMinYMin slice"

to do this for me, but it's still resizing to maintain aspect ratio.

CodePudding user response：

The following CSS might be helpful. The "lottie" will take up the full width and height of the screen, and z-index set to -1 keeps it behind other elements.

lottie-player {
  position: absolute;
  top: 0;
  bottom: 0;
  left:0;
  right: 0;
  z-index: -1;
}