CODEWITHSUNDEEP
svgbackground-image
Peter
Peter

Reputation: 11835

SVG - strech pattern xLink background image to 100%

how can i strech to pattern to 100% width and height?

FIDDLE http://jsfiddle.net/unegvgao/

<pattern patternUnits="userSpaceOnUse" id="pat1" x="0" y="0" width="100%" height="100%">
    <image width="100%" height="100%" xlink:href="http://img.wallpaperstock.net:81/fire-reflection-wallpapers_12396_1280x960.jpg" />
</pattern>

Upvotes: 0

Views: 508

Answers (1)

defghi1977
defghi1977

Reputation: 5359

Add preserveAspectRatio attribute to image element.
http://jsfiddle.net/defghi1977/x4c1qhwu/

<pattern patternUnits="userSpaceOnUse" id="pat1" x="0" y="0" width="100%" height="100%">
    <image preserveAspectRatio="none" width="100%" height="100%" xlink:href="http://img.wallpaperstock.net:81/fire-reflection-wallpapers_12396_1280x960.jpg" />
</pattern>

Upvotes: 1

Related Questions