"Bad src attribute value for img element: must be non-empty", for dynamically generated img src

I have a website with an image slider. I keep some image tags blank when images load, when a slide appears in view for faster page loading. Image tags are defined as follows:

<img data-src="img/portfolio-desktop1-small.png" src="" alt=""/>

What I'm doing is a slide function. I change srcto data-srcjQuery animation. The slider works great. My problem is that when I try to check it in the w3c validation tool , it gives the following error:

Line 131, Column 179: Bad value for attribute srcfor element img: must be non-empty.

...data-src="img/portfolio-desktop1-small.jpg" src="" alt=""/>

URL Syntax:
Any URL. For example: /hello, #canvasor http://example.org/. > Symbols must be represented in NFC, and spaces must be escaped as %20.

Is there a way to fix this without modifying JavaScript or CSS? If I leave it this way, what could be the possible harmful consequences of this question?

+4
source share
2 answers

What happens if you just remove the src attribute and then add it on the fly when you need it. The src attribute is not required. And, in my opinion, I would not worry about what the w3c verification tool proves anyway. While you check it in the necessary browsers, and it works.

+1
source

src #:

<img data-src="img/portfolio-desktop1-small.png" src="#" alt="Thumbnail">

HTML W3C , , . *

, src, , HTTP- :

<img data-src="img/portfolio-desktop1-small.png" src="bogus.png" alt="Thumbnail">

: URL- .

* . , #. - , .

. sidehowbarker:
fooobar.com/questions/993911/...

+7

All Articles