如何从浏览器中获取 CSS 动画并导出其 GIF?

如何从浏览器中获取 CSS 动画并导出其 GIF?

我正在执行以下 CSS3 动画:http://dabblet.com/gist/2884702。它基本上是对镜子绕 x 轴旋转的模拟。

现在,我希望在 PowerPoint 演示文稿中展示该内容。由于 PowerPoint 没有 webkit 引擎,因此我想提取该动画的 GIF 动画图像,并将其嵌入到我的演示文稿中。

问题是什么?无论我怎么尝试,我都无法制作出相当流畅的 GIF 动画。

我在 Google 上搜索,发现很多免费软件声称可以完成这项工作,试了几个,都没有达到预期的效果。我试过伊凡视界,同样的问题(他们的网站也让我想吐)。

那么,有解决办法吗?还是我注定无法显示它?

答案1

使用卡姆工作室。它是免费的,并且可以制作您的桌面视频以及您选择显示的任何内容。

那么...开始录制,录制一段动画短片,然后编辑视频并裁剪掉所有不需要的内容。好了。现在您有了一个可以嵌入演示文稿或转换为动画 GIF 文件的视频。

编辑好的,所以您想将制作的 AVI 文件嵌入到演示文稿中。根据 Microsoft 的说法...

方法 4:将影片作为包插入

您可以将电影文件作为包插入到 PowerPoint 演示文稿中。为此,请按照以下步骤操作:

插入菜单,点击目的

点击创建新的,然后点击包裹在下面对象类型

当您将电影作为包插入 PowerPoint 演示文稿时,电影文件将保留在演示文稿中嵌入的包内。如果您将演示文稿移至其他位置,包也会移至此位置。

此方法是将电影嵌入 PowerPoint 演示文稿的唯一方法。包是将 OLE 流嵌入到文件中的 OLE2 包装器对象。此文件将自身注册为 Packager 对象。打开 Packager 对象时,将读取内容。然后,调用适当的扩展动词。通常,.avi 文件由 Windows Media Player 动词激活。

如果您不关心 PowerPoint 演示文稿的大小或演示文稿的播放速度,则可能需要使用此选项。使用此方法时,请确保所有内容都在一个文件中。如果使用此方法插入较大的 .avi 文件,计算机可能会遇到性能问题。

影片播放

要使 Packager 对象在演示文稿中发挥作用,请按照下列步骤操作:

右键单击插入的对象,然后单击动作设置

点击对象动作。然后点击激活内容在里面对象动作列表。

当您单击演示文稿中的 Packager 对象时,影片将在演示文稿上方的单独窗口中播放。

这是从这个Microsoft 文章

现在,如果你想将 AVI 转换为 GIF 文件以便于嵌入,你可以使用在线转换器,例如 Zamzar

答案2

你可以试试Cockos LICEcap。LICEcap 是 GPL 免费软件。它直接捕获屏幕并将其保存为 .GIF 或 .LCF 格式。

LICEcap 的一些功能(来自其网站):

功能和选项:

  • 直接记录为 .GIF 或 .LCF。
  • 录制时移动屏幕截图框。
  • 暂停和重新开始录音,可选择插入文字信息。
  • 全局热键(shift+space)用于在录制时切换暂停
  • 可调整最大录制帧率,以限制 CPU 使用率。
  • 基本标题框,可带或不带文字。
  • 记录鼠标按钮的按下。
  • 显示录音中的已用时间。

查看动画的 GIF 版本:)

在此处输入图片描述

答案3

看起来有人在这里创建了一个工具: https://www.npmjs.com/package/@scenejs/render

来源: https://github.com/daybrush/scenejs-render

我还没有尝试使用它,所以不能保证,但它声称可以将 css 动画转换为视频文件。

答案4

您可以测试: Gif相机

- 版本 4.5 - 686 KB(单个 exe 文件,无需安装)。 - 兼容 Windows 8、7、Vista、XP。

  • 实用、简单、有趣的动画 gif 制作应用程序。
  • 其工作原理类似于位于所有窗口顶部的相机,因此您可以移动它并调整其大小来记录所需的区域。
  • GifCam 仅具有以鼠标为中心的界面。

轻松捕捉: 准备就绪后,单击“Rec”开始录制或单击“Frame”录制单帧。

  • 全屏忽略录制区域并捕获全屏。
  • 预览:带尺寸预览。
  • 记录不同尺寸的帧(记录时调整大小)。
  • 捕获光标:用于演示鼠标交互。
  • 导出为 AVI:将您的记录导出为未压缩的视频。

捕捉/编辑:简单而强大

  • 调整帧延迟、删除帧/添加或移除延迟、调整大小、裁剪、添加反向帧、5 种颜色设置、色调和饱和度、添加文本等...

相关内容