![]() We can do that via JS if we inline the SVG directly into the HTML. Let’s take the same basic SVG from the example and say we want to add movement to the eyes. ![]() ![]() Inlining the SVG provides more predictable results and control than if it is added with or because the SVG source is directly available in the DOM which is exposed to the accessibility API that is used by AT. So, if we want more control over the SVG, we’ll need to inline the SVG directly in the HTML. This example is fine to use as just a basic image replacement, but it doesn’t allow for us to access to contents of the SVG for either AT or CSS/JS. □ Shout out to the folks that fixed the Safari/WebKit bug! However, if the majority of the users are still on older versions of Safari or iOS, we need to add role="img" to the. If the site’s users are on latest version (Safari Desktop Version 9.1.1 or iOS Version 9.3.2) or newer we can stop here. Let’s check our browser usage stats to see if we need to do anything further. See the Pen SVG as img src by Heather Migliorisi ( on CodePen.
0 Comments
Leave a Reply. |
AuthorWrite something about yourself. No need to be fancy, just an overview. ArchivesCategories |