The 2026 Drupal Business Survey is open. Your response will help shape the future of the Drupal business ecosystem.Hi,
as a reference:
https://drupal.org/node/2084979#comment-8845583
Fallback images in 7.x-2.x-dev currently aren't working without javascript.
The image tag gets its src attribute via js. It may not have this attribute initially, because then two images would get loaded by the browser.
Desireable is be a fallback solution with a "noscript" tag to make images visible even if javacript is disabled.
| Comment | File | Size | Author |
|---|---|---|---|
| #7 | picture-remove-fallback-srcset-path-width-2280315-7.patch | 565 bytes | johnpitcairn |
Comments
Comment #1
jelle_sThe problem with that is, if you have javascript disabled and your browser supports the picture (or even just srcset on an img tag) element, you will see 2 images (the one outputted by the picture element and the fallback image). This is the reason that, in D8, the noscript fallback image was dropped.
For reference:
Browsers supporting srcset: http://caniuse.com/#search=srcset
Chrome Canary 37 supports picture: https://twitter.com/respimg/status/471347330411945984
A more detailed explanation of why the noscript fallback image was dropped in D8:
#2227435: Remove noscript from picture element markup
Comment #2
indigoxela commentedHi Jelle_S,
I see...
The problem is, that the "srcset" attribute is only supported by very few (even current) browsers.
By now only the latest Webkit browsers as far as I know.
Neither Firefox nor Internet Explorer can handle them yet. That hopefully will change for desktop browsers, at least for Firefox, in near future. It will stay a problem for mobile devices though, as they don't get updates that fast.
And for customers/users solutions for IE still are a must.
Comment #3
attiks commentedI understand your problem, but
1/ The number of people not using javascript is very limited, most sites will have other problems as well if js is disabled
2/ We try to maintain as close as possible to both Drupal 8 and the picture polyfill/spec
We could make it an optional setting, it would be great if you can provide a patch
Comment #4
attiks commentedComment #5
indigoxela commented@attics:
I can only partly agree with that. Think of browser extensions like NoScript or Script Defender.
That makes sense and I really understand that.
I'm only using picture on a single customers web. Rather than elaborating a solution, I will uninstall picture there or replace it.
Nevertheless I would like to thank you both for your excellent work.
Feel free to close this issue.
Comment #6
attiks commentedComment #7
johnpitcairn commentedI understand the reasoning behind not supporting older browsers with javascript disabled. But current versions of Safari and a couple of older versions of Chrome do understand the srcset attribute but do not understand width when that is added to the image path.
That "1200w" will cause the fallback image to not be rendered with javascript disabled, even though the browser understands srcset and does not need an image src attribute.
To support these browsers with javascript disabled it is possible to make a very simple patch to theme_picture() and remove the path width for the fallback image only.
Doing so will not cause the image to be downloaded or rendered twice, and will not adversely affect javascript-disabled browsers that do understand width in the srcset path.
Comment #8
attiks commentedIn #2449033: Images in Chrome always stretched to 100% width the question was asked to add the width in px, but this still doesn't solve the problem, I proposed to add an option so site builders could choose to output src as fallback.
Marking this as duplicate since it will be fixed if you use the src fallback.
Comment #9
johnpitcairn commentedThanks, I see that has been committed, will try latest dev.