gradient-html-06e.html 861 B

123456789101112131415161718192021222324
  1. <!--
  2. Any copyright is dedicated to the Public Domain.
  3. http://creativecommons.org/licenses/publicdomain/
  4. Ensure that SVG elements using fill="url(#...)" are *not*
  5. affected by mozSetImageElement.
  6. -->
  7. <!DOCTYPE html>
  8. <html>
  9. <body style="margin:0">
  10. <svg width="300" height="300">
  11. <rect width="300" height="300" fill="url(#g)"></rect>
  12. <linearGradient id="red" gradientUnits="objectBoundingBox" x2="0" y2="1">
  13. <stop stop-color="red" offset="0"></stop>
  14. <stop stop-color="black" offset="1"></stop>
  15. </linearGradient>
  16. <linearGradient id="g" gradientUnits="objectBoundingBox" x2="0" y2="1">
  17. <stop stop-color="lime" offset="0"></stop>
  18. <stop stop-color="black" offset="1"></stop>
  19. </linearGradient>
  20. </svg>
  21. <script>document.mozSetImageElement("g", document.getElementById("red"));</script>
  22. </body>
  23. </html>