vendredi 25 mars 2016
Eugenio
<svg width="497" height="635" xmlns="http://www.w3.org/2000/svg" xmlns:svg="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<!-- Created with SVG-edit - http://svg-edit.googlecode.com/ -->
<defs>
<pattern id="gridpattern" patternUnits="userSpaceOnUse" x="0" y="0" width="100" height="100">
<image id="svg_2" x="0" y="0" width="100" height="100"/>
</pattern>
<filter height="200%" width="200%" y="-50%" x="-50%" id="svg_3_blur">
<feGaussianBlur stdDeviation="8" in="SourceGraphic"/>
</filter>
<mask id="face2">
<path filter="url(#svg_3_blur)" fill="#ffffff" stroke-width="5" stroke-dasharray="null" stroke-linejoin="null" stroke-linecap="null" d="m169.83333,238.99997l-20.5,5l-23.99999,54.00009l-8,34l23.99999,2l-4,46l-55.99999,92l-146,77.99982l40,-611.99987l229.99999,3.99999l30,130.00002l-22,145.99995l-43.5,21z" id="svg_3"/>
</mask>
</defs>
<g id="nose">
<title>Nez à nez</title>
<image xlink:href="http://36.media.tumblr.com/f1382890b0039cf68a0d60b2e61d17a3/tumblr_o0h0bl5E5e1qlapqpo1_1280.jpg" id="svg_1" height="635" width="497" y="0" x="0"/>
<image xlink:href="https://lh3.googleusercontent.com/-4KXnjJmLeU8/VvVZqnoi9tI/AAAAAAAAcMA/njsFSL7Z_yIuxz48h3t0ZlDGWgz4Mz6nwCCo/s1500-Ic42/nez.png" id="svg_6" height="637" width="497" y="-64" x="-132">
<animateMotion values="0,0;100,58;0,0" begin="nose.mousedown" dur="8s" fill="freeze"/>
<animate attributename="opacity" values="0;1;1;0" dur="8s" begin="nose.mousedown"/>
</image>
<image id="svg_4" xlink:href="http://36.media.tumblr.com/f1382890b0039cf68a0d60b2e61d17a3/tumblr_o0h0bl5E5e1qlapqpo1_1280.jpg" height="635" width="497" y="0" x="0" style="mask:url(#face2);"/>
<g id="svg_10" opacity="0">
<ellipse ry="41.33333" rx="61.33334" id="svg_7" cy="211.66667" cx="257.16671" stroke-linecap="null" stroke-linejoin="null" stroke-dasharray="null" stroke-width="5" fill="#ffffff"/>
<path id="svg_8" d="m246.66672,254.33333c0,1.33334 0,38.6667 -0.50003,37.6667c-0.50006,-1 17.83337,-45.66669 17.33331,-46.6667c-0.5,-1 -16.83328,9 -16.83328,9z" fill="#ffffff"/>
<text xml:space="preserve" text-anchor="middle" font-family="serif" font-size="24" id="svg_9" y="218" x="259.5" stroke-linecap="null" stroke-linejoin="null" stroke-dasharray="null" stroke-width="0" fill="#000000">pouic !</text>
<animate attributename="opacity" values="0;0;0;0;0;1;0;0;0;0;0" dur="8s" begin="nose.mousedown" repeatCount="1"/>
</g>
</g>
</svg>
-
Animation attribute (width, opacity, etc.) <animate attributeName="?" begin="0s" dur="6s" repeatCount...
-
Generate