Skip to content

Instantly share code, notes, and snippets.

@jasondavies
Last active December 15, 2015 13:58
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save jasondavies/5270648 to your computer and use it in GitHub Desktop.
Save jasondavies/5270648 to your computer and use it in GitHub Desktop.
IRI Retrieval Bug
<!DOCTYPE html>
<meta charset="utf-8">
<style>
body { font-family: sans-serif; }
</style>
<svg xmlns="http://www.w3.org/2000/svg" width="100" height="100">
<defs>
<radialGradient id="fill" cx="75%" cy="25%">
<stop offset="5%" stop-color="#ebebef" stop-opacity="0.5"/>
<stop offset="100%" stop-color="#a2abb3" stop-opacity="0.5"/>
</radialGradient>
</defs>
<g style="fill: url(#fill)" id="test">
<rect width="100" height="100"/>
</g>
</svg>
<ul>
<li>window.getComputedStyle(element, null).getPropertyValue("fill"): <span id="computed-style-property"></span>
<li>window.getComputedStyle(element, null).fill: <span id="computed-style-fill"></span>
<li>element.style.getPropertyValue("fill"): <span id="element-style-property"></span>
<li>element.style.fill: <span id="element-style-fill"></span>
<li>element.getAttribute("style"): <span id="element-attribute"></span>
</ul>
<script>
var e = document.getElementById("test");
//e.style.setProperty("fill", "url(#fill)");
document.getElementById("computed-style-property").textContent = window.getComputedStyle(e, null).getPropertyValue("fill");
document.getElementById("computed-style-fill").textContent = window.getComputedStyle(e, null).fill;
document.getElementById("element-style-property").textContent = e.style.getPropertyValue("fill");
document.getElementById("element-style-fill").textContent = e.style.fill;
document.getElementById("element-attribute").textContent = e.getAttribute("style");
</script>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment