CODEWITHSUNDEEP
javascripthtmluser-interface
meow
meow

Reputation: 28164

Preventing image URL from showing when page is still waiting for remote image

Before the image finishes loading, it shows the URL of the image.

This looks really bad, esp when the user has a slower connection

Example: see the second image, which is still loading:

example

Upvotes: 0

Views: 58

Answers (2)

DhruvPathak
DhruvPathak

Reputation: 43235

  1. Remove "Alt" and "title" attributes of your <img tag.
  2. put image style, width and height equal to the final thumbnail that will load there. ( create CSS class for this preferably )

These 2 alterations will give a better user experience.

<img src="http://mysite/images/myimg.jpg" style='width:100px;height:100px;' />

Upvotes: 1

Alex
Alex

Reputation: 14618

That's the alt html attribute value.

<img src="http://yoursite/path/image.jpg" 
    alt="text to display when no image available"/>

simply put a blank string in the alt attribute.

That should be the easiest, javascript-free method of doing this.

Upvotes: 1

Related Questions