LINUX.ORG.RU

[svg][firefox][smil][animate] анимация средствами SMIL в firefox

 ,


0

0

Анимация посредством SMIL в firefox, почему то не поддерживается, тестировал в 3.6.9 версии и MozillaDeveloperPreview/4.0b3pre,
все плагинны отключал,
Chrome,Opera, поддерживают.
вот простой исходник :

<svg width=«150» height=«150» xmlns="http://www.w3.org/2000/svg" version=«1.1»>
<title>Лекция 11. Анимация</title>
   <desc>
   Пример animateGradient2.svg
   </desc>

<defs>
<radialgradient id=«MyGradient»>
<stop offset=«0» style=«stop-color: blue;»/>
   <stop offset=«100%» style=«stop-color: white;»>
<animate attributeName=«offset» from=«0%» to=«100%» dur=«10s» repeatCount=«indefinite»/>
</stop>

</radialgradient>

</defs>
<circle cx=«75» cy=«75» r=«70» fill=«url(#MyGradient)»/>
</svg>

Напрашивается не заморачиваться со SMIL, и задать анимационные эффекты при помощи Javascript как например здесь http://srufaculty.sru.edu/david.dailey/svg/blurring.svg

Поделитесь пожалуйста опытом, или ссылкой на библиотечку какую нибудь с примерами, где кроссбраузерно можно создавать анимацию.



Последнее исправление: Chu (всего исправлений: 1)

нарыл пока этот плагин для JQ http://keith-wood.name/svg.html остановлюсь на нём, но если у вас есть другие решение напишите пож-ста.

Chu
() автор топика
Ответ на: комментарий от Chu

Вообще-то давно писали, что Fx в плане SVG и анимации этого дела отстаёт от других. Правда не знаю как именно дело сейчас обстоит (потому только предполагаю).

Deleted
()
Ответ на: комментарий от Deleted

Firefox в моих глазах, ранее был флагманом всего прогрессивного в вебе? а тут...

SMIL - он же с прошлого века. Ну как можно обойти то что рекомендует W3C, своим вниманием.

Chu
() автор топика
Ответ на: комментарий от Chu

>Firefox в моих глазах, ранее был флагманом всего прогрессивного в вебе

У тебя глаза глючат
В FF - либо Fx, если угодно - всегда уделялось больше внимания глаз-конфетам, чем свежим (и не очень) драфтам.

wxw ★★★★★
()
Ответ на: комментарий от wxw

Ну я имею ввиду поддержку xhtml, html5, css, и следование стандартам. В той же Опере немало непонятных глюков возникало.

Chu
() автор топика

Теперь Chrome мозг парит, обычный ресайз картинки делаю:

<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg width="950" height="310" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns="http://www.w3.org/2000/svg">
<script type="text/ecmascript" xlink:href="http://leunen.d.free.fr/fakesmile/smil.user.js"/>
 <g>
  <title>Layer 1</title>
  <image x="-325" y="-106" width="1600" height="523" id="oblaka_begut" xlink:href="http://bla-bla-bla.jpg">
          <animate attributeName="x" from="-325" to="0" dur="30s" fill="freeze"/>
          <animate attributeName="y" from="-106" to="0" dur="30s" fill="freeze"/>
          <animate attributeName="width" from="1600" to="950" dur="30s" fill="freeze"/>
          <animate attributeName="height" from="523" to="310" dur="30s" fill="freeze"/>
  </image>
 </g>
</svg>

Chrome слишком вумный, оптимизирует по своему видать, вместо отображения плавного, картинку просто не отрисовывает, ждет 30секунд заданных в параметре dur, и конечный результат вместо анимации выводит.

Chu
() автор топика
Вы не можете добавлять комментарии в эту тему. Тема перемещена в архив.