Badmik, только сегодня увидел твой комментарий, прости если долго не отвечал. Надеюсь твой вопрос все еще актуален.
По сути с условиями, что ты написал, анимация будет действительно бесконечной.
Остановка анимации любого из элементов будет инициировать воспроизведение этой же анимации на следующем элементе, а так как ты вместе с этим начинаешь еще одну анимацию по событию click, то начинается вакханалия, потому что воспроизводится не одна анимация, а две.
Анимация с условиями begin="prev.end", end="next.click" будучи запущенной один раз не сможет остановиться до перезагрузки документа.
За все время, что я думал над твоим вопросом, я не смог придумать адекватный способ реализации. Вижу только 2 варианта:
Выбрать что-то одно (либо бесконечный, либо анимацию по клику)
Воспроизводить обе анимации одновременно (Прокатит только если они между собой не конфликтуют)
Дело в том, что я изначально писал статью в Word и я исправил все ошибки, которые он мне подсветил. Перед публикацией статьи я перечитал ее целиком 7 раз и считаю, что исправил все, что было в моих силах.
Не поймите меня неправильно, я согласен, что читать орфографически правильный текст гораздо проще и приятнее. Но все же я надеюсь на некоторое понимание и снисходительность читателей.
Когда я писал про основные способы анимации, я изначально не включал в этот список JS
Здесь не будет никаких плагинов, библиотек и прочего, речь пойдет только о чистом SVG.
Поскольку он является языком программирования, я считаю его самостоятельной технологией, которая не является частью SVG и существует отдельно от него.
То же можно сказать и про CSS. Именно поэтому я уделил ему в статье не так много места как SMIL. (возможно я все таки расширю эту статью информацией про JS)
Статья достаточно объемная, и пусть я старался не допускать ошибок, признаю что они есть. Однако статья написана чтобы донести знания, а не доставить эстетическое удовольствие. Буду рад исправить ошибки если вы напишите мне где конкретно я их допустил.
Количество цифр после запятой можно уменьшить еще на этапе экспорта из Illustrator (уменьшив значение параметра «качество»). Об SVGO я знаю и упоминал его в туториале про анимированный вопросительный знак. А про поддержку href я действительно забыл упомянуть. Исправлюсь.
Спасибо за дополнения.
По сути с условиями, что ты написал, анимация будет действительно бесконечной.
Остановка анимации любого из элементов будет инициировать воспроизведение этой же анимации на следующем элементе, а так как ты вместе с этим начинаешь еще одну анимацию по событию click, то начинается вакханалия, потому что воспроизводится не одна анимация, а две.
Анимация с условиями begin="prev.end", end="next.click" будучи запущенной один раз не сможет остановиться до перезагрузки документа.
За все время, что я думал над твоим вопросом, я не смог придумать адекватный способ реализации. Вижу только 2 варианта:
Не поймите меня неправильно, я согласен, что читать орфографически правильный текст гораздо проще и приятнее. Но все же я надеюсь на некоторое понимание и снисходительность читателей.
То же можно сказать и про CSS. Именно поэтому я уделил ему в статье не так много места как SMIL.
(возможно я все таки расширю эту статью информацией про JS)
Спасибо за дополнения.