how to order an svg visibility animation to toggle do one image after another -


i want make images included in svg file toggle on , off in order. need know how set begin , dur attributes on animate element.

assuming have images following

<image visibility="visible" xlink:href="image1.gif" x="0" y="0" height="100%" width="100%">    <animate attributename="visibility" begin="0s"  from="visible" to="hidden" dur="5s" repeatcount="indefinite" /> </image> <image visibility="hidden" xlink:href="image2.gif" x="0" y="0" height="100%" width="100%">    <animate attributename="visibility" begin="5s"  from="hidden" to="visible" dur="4s" repeatcount="indefinite" /> </image> 

how them toggle visibility in order, first image visible @ first 4 seconds, turns invisible next image visible 4 seconds, turns invisible , previous image visible next 4 seconds.

i prefer declarative animation style.

ok figured out how example in book svg unleashed http://my.safaribooksonline.com/book/photo-and-graphic-manipulation/0672324296

<image visibility="visible" xlink:href="image1.gif" x="0" y="0" height="100%" width="100%">     <animate id="img1ani" attributename="visibility" begin="1s; img2ani.end+1s"  from="visible" to="hidden" dur="5s" fill="freeze" />  </image>  <image id="img2" visibility="hidden" xlink:href="image2.gif" x="0" y="0" height="100%" width="100%">     <animate id="img2ani" attributename="visibility" begin="img1ani.end+1s"  from="hidden" to="visible" dur="5s"/> </image> 

just in case else has same problem,img1ani begins after 1 second or 1 second after image2ani ends while img2ani begins 1 second after img1ani ends. in way toggles between 2 images.


Comments

Popular posts from this blog

yii2 - Yii 2 Running a Cron in the basic template -

asp.net - 'System.Web.HttpContext' does not contain a definition for 'GetOwinContext' Mystery -

c# - MSDN OneNote Api: Navigate to never before opened page without opening a OneNote Application Window -