Infinite Scroll – How to Remove the Noticeable Cut at the Loop End
https://codepen.io/Redcaus12345/pen/EaYqEdE How can I make the end of the loop smoother? There's a noticeable cut or restart that doesn't look seamless. Any tips or suggestions ?
47 Replies
When calculating the container width maybe you should also take into account the gap between each image
it worked but somehow the first image always needs to load
set it as high priority
with js ?
no, with html
how
<img src="bl1.jpg" alt="image 1" loading="eager" fetchpriority="high">
ypu, like that
still doesnt work
save the space for it then
it takes like 2-4 seconds to load still
yeah, that's bad
no image should take that long
just the first img
if i change the img to another img it still needs to load
https://cdn.pixabay.com/photo/2023/10/27/12/13/vineyard-8345243_1280.jpg
you're loading a 300+kb image
nah on vscode i am using diffrent img
on codepen it doesnt lag just on liveserver
can you show the size of the image?
width: 700px;
all img have 700px
is that the actual size of the image?
or just the css size?
css size
what's the actual size of the image?
i can imagine it taking quite a long time to load them all
but all loading normal
only the first img is loading behinf
you should convert it to avif
Here the two make a problem
I put lazy just as a test
show me the network tab in the developer tools
This one never used it before
but show everything that's loaded, not just a single file
That’s all
There is nothing else loading
there has to be, or you wouldn't have a site
the fact that a css file loaded means that there is html too
or you accessed the file directly
so, make sure it is set to show all files
am i stupid
i am on all
and this is just what is showing me
refresh the page
now
is there something wrong?
yes: 304
what does it mean
those are redirects
that means?
is that why it takes for only the 1 img to load that long
it shouldn't be doing that, so
so how can i change that
i am on liveserver
the images should be stored locally
if the img are big enough there is no problem with the first img loading problem
but why do the other img dont takeload time ?
i don't know, im not seeing it
oh okay but thanks for the help
can you try it without the live server?