问题标签 [smil]
For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.
javascript - SVG 元素的动态动画在 IE 中不起作用
我正在尝试在使用 jquery 动态添加 DOM 元素的同时制作 SVG 元素的动画。如果我在下面添加这些元素，<body>那么它的工作示例是
http://jsfiddle.net/bZdfH/2/
当我动态添加它时，动画不会在 IE 中启动，但它适用于 Chrome 和 FireFox。这就是我所拥有的。
这是工作示例的jsfiddle。有人可以帮我吗？
svg - 在 SVG 中使用 SMIL 的情节运动
我在http://jsfiddle.net/emanuensis/H68jS尝试了一个简单的 SVG 图形的 SMIL 动画这个想法是，每个鼠标向上或向下移动都会导致黄色圆盘朝那个方向移动 1 秒并停止......并从该位置等待进一步的鼠标悬停。
不幸的是，现实（在 FF 和 Chrome 中）是非常多变的。有时它似乎采用了'fill =“freeze”'属性，有时它会一直向上或向下重新启动，有时它会在多次迭代之前停止的地方重新启动。
这是我第一次使用http://www.w3.org/TR/smil-animation上的规范，所以我想我做错了什么，或者遗漏了一些属性，但我不知道是哪个或在哪里。
繁琐的代码：
svg - 动画中的`fill="freeze"`失败
我在http://jsfiddle.net/emanuensis/NNvjA/上尝试了一个简单 SVG 图形的 SMIL 动画，这个想法是每个mouseover向上或向下的单词都会导致黄色冰球朝那个方向穿梭，停了一小段路，由mouseout事件决定......并从该位置等待进一步mouseover的 s。
不幸的是，现实（在 FF 和 Chrome 中）并非如此。
ABA 形式（其中 A 是任意数量的 ups，B 是 down - 或 vv）导致第二个 A 的 noop。
第一个 Afreezes属性的值 在第一个它的类型（向上或向下）的最后一个事件（可能有许多总是重新归位）上获得的值。即B 从那个位置开始（归巢）。
即使在第一个 Afreezes中也没有加法。即在穿梭之前每个事件的家。
freeze也许还有另一种在短时间内强制有效的方法（即不是一直到最后——这是一个方向，而不是一个幅度。）
这里很繁琐
video - 一个接一个地播放 .m4v 视频。如何使用 SMIL for QuickTime 对视频播放列表进行编程
我在自己的服务器上以相同的文件夹结构组织了 .m4v 视频场景文件。现在用户可以一个一个地观看这些视频，并且必须单击才能转到下一个或上一个。场景时长 1-4 分钟。我想提供一个接一个地播放属于一集的所有场景的选项。
我知道这可以通过 SMIL 来完成。这是最好的方法吗？我能够用 HTML 和其他语言编写基本脚本。
用户应该能够点击一个名为“播放完整视频”的按钮。应该会打开一个新窗口，并且应该开始本集的第一部电影。应该有下一个和上一个按钮可以跳转到下一个场景。
由于文件夹结构相同，并且所有视频文件都命名为 01.m4v / 02.m4v，因此解决方案应尽可能通用。
最好是我只定义剧集的名称（这是第一个文件夹名称的一部分），脚本应该自动收集和计算其余部分。
任何想法将不胜感激。谢谢。
svg - SVG 动画不会重新触发动画
我有两个 SVG 动画附加到路径元素。我想将鼠标悬停并Anim1开火，然后鼠标悬停并Anim2开火，我希望这是可重复的。我正在使用begin=X.mouseover,begin=X.mouseleave和fill="freeze".
它第一次运行良好；所以 mouseoverAnim1起火， mouseleaveAnim2起火。但是它只会Anim1在鼠标悬停时触发并且Anim2永远不会再次触发（或者至少我看不到它做任何动画）。
动画是我正在为属性设置动画的路径d。我在 Chrome 和 Opera 中尝试过，结果相同。
我已从代码块中删除了实际路径，以使其更易于阅读。
我也尝试过使用beginElement& endElement，结果相同。
谢谢你看..
php - 如何在 RED5 服务器上为 VOD 使用 SMIL 播放列表文件
我想在 Red5 服务器上使用 SMIL 播放列表文件流式传输 vod。我如何在 Red5 服务器上实现这一点。在 wowza 服务器上，以下链接描述了如何配置 SMIL 播放列表文件
我正在使用 AWS S3 进行视频点播。我已经创建了存储桶并向所有人授予了完全许可。我正在使用 RTMP coludfront 进行流式传输。这是我的以下 SMIL 文件
我怎么能像 wowza 一样在 red5 中做到这一点。
javascript - 什么是 SMIL？它在架构中的位置是什么？
我想知道SMIL到底是什么？我的意思是为什么需要它以及如何将它们集成到 javascript 应用程序中。在应用程序架构中它的位置是什么？它的意义是什么？
xml - 使用在 SVG viewBox 本身上只能工作两次
我一直在尝试在 SVG viewBox 上使用 2 个不同的 s 在大小之间循环，但是尽管两个动画都独立工作，但如果第一个动画在它之后再次开始，第二个动画将不会运行。对我来说奇怪的是，第一个会继续运行，表明它“识别”了另一个动画的结束，即使它没有显示。如果我删除“small.end”，它甚至会以它们应该的方式运行......但这意味着它们不会一个接一个地重复。
我一直在研究坐标系、加法和累积动画等各种东西，但似乎无法理解为什么会这样。我怀疑这可能是一个以某种方式“重置”动画状态的问题，但我有点超出我的深度 - 我不介意使用 javascript 或任何库来实现这一点。任何帮助或指示将不胜感激。谢谢！
animation - SVG 动画未正确链接
我有以下 svg，我正在尝试为形状设置动画。
我面临的问题是第一个动画（#close）只在开始时发生一次，然后再也不会发生。第二个动画 (#open) 照常重复。
这是一个带有我的代码和更简单动画的代码笔（它可以正常工作）
http://codepen.io/dogoku/pen/yxKjs
谢谢你的帮助
html - SVG/SMIL 回流/重绘的性能影响？
过去我在 javascript 方面做了很多工作，包括一些 DOM 操作。从那里我了解到，在某些情况下，重排/重绘可能是一个很大的性能问题，通常应该限制在最低限度。例如，当添加一组 div 时，您应该一次添加所有内容（将它们附加到 DOM 之外的 div，然后附加它），而不是一个接一个地附加它们。重绘也是如此，它可以通过更改元素的 CSS 属性来触发。虽然我必须承认我从来没有这么多地研究过重绘，所以我对最后一部分的看法可能是错误的。
这是否也适用于 SVG（看到它使用一种似乎合理的 DOM）？不同的 SVG 元素有区别吗？例如，动画元素不会创建重排是有道理的，因为它不是新的 SVG 元素，而更像是一个属性。
我不确定的是 SVG 的重绘，它们是否以与 CSS/HTML 相同的方式存在？毕竟 SMIL 动画已经创建了帧，所以像“重绘”这样的事情可能没有任何区别，因为无论如何都要渲染新的帧。
任何对 SMIL 内部运作有更深入了解的人可以为我澄清这些事情吗？