Я реализую отложенную загрузку на своем веб-сайте, но по какой-то причине, когда изображение полностью загружено и стало видимым, положение изображения изменяется.
Я попытался изменить расположение файлов js и css, но безуспешно.
https://jsfiddle.net/f3q01ha5/3/
- Это без отложенной загрузки и где я хочу положение фона:
.right-image{
background: url("https://images.unsplash.com/photo-1511910849309-0dffb8785146?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=800&q=60");
}
Это
с отложенной загрузкой, но обратите внимание, что оно ссылается на то же изображение, но положение фона изменяется при полной загрузке:
.right-image
{
background: url("https://placekitten.com/g/500/500");
}
.right-image.visible {
background: url("https://images.unsplash.com/photo-1511910849309-0dffb8785146?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=800&q=60");
}
Я прикрепил jsfiddleно, пожалуйста, обратите внимание, что я не мог заставить ленивый груз работать на этом сайте, но он отлично работает локально.
Я ожидаю, что фоновое изображение загружается в том же месте, независимо от того, использую ли я ленивый загрузчик.Любое руководство много значит.
Спасибо