How to make the background image fill the offscreen when I apply a background-position transform animation trough jquery? As you can see,when the animation ends,the div is filled with white.
.firstpage{
background-image: url('bcb.png');
min-height: 100vh;
min-width: 100vh;
background-attachment: fixed;
background-position: center;
background-repeat: no-repeat;
background-size: cover;
}
$(".firstpage").animate({
'background-position-y': '200px',
});
The bcb.png image has a width of 2720px and a height of 1880px,so it's larger than my 100vh(1920x1080 resolution)
I've uploaded a quick video on YT just in case my question wasn't clear. https://www.youtube.com/watch?v=5BSX2r8f5s4&feature=youtu.be