question-mark
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.

With very large images, border and background are shown before image loads

See original GitHub issue

For large images, the border/background loads significantly faster than the image; hover the image on this page: large landscape. You should see the border/background load very quickly, but the image loads in afterwards. Ideally, I think the border/background should delay displaying until the image is ready to be displayed. I tried using the loaded class but it doesn’t seem to help here.

Related(?) side note: I originally tried hotlinking the image above, but it actually reproducibly crashed my browser. Does hovering this link work for you? hotlink to landscape image

Issue Analytics

  • State:closed
  • Created 4 years ago
  • Comments:27 (17 by maintainers)

github_iconTop GitHub Comments

1reaction
tophfcommented, Mar 14, 2020

Had to fix the fix. Twice!

1reaction
tophfcommented, Mar 14, 2020

Ah, Firefox, the thing I always forget about. Yeah I see it there, gonna investigate.

Read more comments on GitHub >

github_iconTop Results From Across the Web

Border and Title showing while Image loading in Firefox
Chrome and other browsers load images without any borders and titles which looks much 'cleaner'. In words, these borders produced by firefox are ......
Read more >
Lazy Loading Images – The Complete Guide - ImageKit.io
Everything about Image Lazy loading - what is it, why is it important, how to implement lazy loading of images and the best...
Read more >
Preventing Content Reflow From Lazy-Loaded Images
Lazy loading doesn't guarantee that the image will fully load before it enters the viewport. The result is a perceived janky experience, ...
Read more >
Everything you need to know about images loading
Today I want to talk about how images load on the web. ... This is similar to trying to show background image on...
Read more >
border-image-width - CSS: Cascading Style Sheets | MDN
The border-image-width CSS property sets the width of an element's border image. ... CSS Backgrounds and Borders Module Level 3
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found