CODEWITHSUNDEEP
htmlcssimagesrc
dangerousdave
dangerousdave

Reputation: 6408

Dummy img src without browser warnings

I have constructed a lightbox for my website. For the purposes of this question, it consists of an img element, that is hidden by default using CSS.

When a thumbnail image on my site is clicked, the src of the img element is overridden using javascript with the appropriate path, and the img is then made visible.

My question is what do I set the img src to when the page is first loaded? If I leave the src blank, i get a browser warning. I would prefer not to load an actual image, as this uses bandwidth. I would prefer not to load a small transparent image of 1px, as this feels like a dirty hack.

Do I have any other options?

Upvotes: 1

Views: 1124

Answers (2)

swisst
swisst

Reputation: 112

I have had very similar problem.

My solution is: make <!-- comment wrapper --> around your <img> tag and after your JS code adds the src parameter, remove the comment.

<!-- <img src="unknown"> -->

This solution is clean and fast (comment is not parsed and analyzed by browser).

Upvotes: 0

Quentin
Quentin

Reputation: 943556

Create the img element with JavaScript.

If some markup (beyond the occasional placeholder div or span) adds nothing for the user before some JS runs, then don't put it in the markup in the first place. Add it with DOM manipulation when it is needed.

Upvotes: 4

Related Questions