Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Support of background images #5

Open
avstudnitz opened this issue May 17, 2021 · 4 comments
Open

Support of background images #5

avstudnitz opened this issue May 17, 2021 · 4 comments

Comments

@avstudnitz
Copy link

avstudnitz commented May 17, 2021 •
edited
Loading

Just to be sure: background images are not supported, right? We are using code like this in custom widgets:

<div class="" style="background-image: url(<?= $escaper->escapeHtmlAttr($image) ?>);">...</div>

We might implement it if it doesn't exist already.
@avstudnitz
Copy link
Author

Seems JPG fallback support will be tricky then...

@jissereitsma
Copy link
Contributor

No, they are not supported. It is tricky anyway. The picture element is the main trick as of yet. I have been working myself on a non-Magento site with a PHP script that generates a base64-encoded string for the image and then uses a cookie to switch in between, but this is not ideal either. With Full Page Caching in mind, the solution either requires JavaScript and some cookie-magic (ugly), or a solution like picture ...

@avstudnitz
Copy link
Author

There might be a native solution for that in the future: see https://raoulkramer.de/avif-webp-images-css-background-usage-progressive-enhanced-with-image-set/.

@jissereitsma
Copy link
Contributor

Hmm, that's still a loooong wait :(

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
Labels
None yet
Projects
None yet
Milestone
No milestone
Development

No branches or pull requests
2 participants
@avstudnitz @jissereitsma