Menu icon Foundation
How do you hide Alt attribute with Interchange and default image in <noscript> tag

Hi,

I was issuing the same question as J.Webb here :

https://foundation.zurb.com/forum/posts/1103-alt-attribute-with-interchange

And, coding as in the documentation (sites/docs):

If you want to support browsers with JavaScript disabled, we recommend setting your default image in a <noscript> tag so that these browsers will have a fallback:

<img data-interchange="[/path/to/default.jpg, (default)], [/path/to/bigger-image.jpg, (large)]">
<noscript><img src="/path/to/default.jpg"></noscript>

If I apply the solution proposed, the alt is shown on the page when there is no javascript.

Yes, it's normal, but not a wanted behaviour in this case. Is there something like a "data-interchange-alt" property or another workaround than html partials ? How can I code this ?

see here https://codepen.io/anon/pen/LJQYLx

ALTnoscriptimagedatainterchange

Hi,

I was issuing the same question as J.Webb here :

https://foundation.zurb.com/forum/posts/1103-alt-attribute-with-interchange

And, coding as in the documentation (sites/docs):

If you want to support browsers with JavaScript disabled, we recommend setting your default image in a <noscript> tag so that these browsers will have a fallback:

<img data-interchange="[/path/to/default.jpg, (default)], [/path/to/bigger-image.jpg, (large)]">
<noscript><img src="/path/to/default.jpg"></noscript>

If I apply the solution proposed, the alt is shown on the page when there is no javascript.

Yes, it's normal, but not a wanted behaviour in this case. Is there something like a "data-interchange-alt" property or another workaround than html partials ? How can I code this ?

see here https://codepen.io/anon/pen/LJQYLx

joe buttler 10 months ago

Thanks for sharing this.