keyframe相关内容

如何使用css动画更改css动画中的字体颜色

我正在尝试这样做，当我打开页面时，test将显示为红色，testing将显示为白色。我希望保留打开页面时使用的延迟(如果运行程序，您将看到该延迟)。 css #hero h1 { display: block; width: fit-content; font-size: 3rem; position: relative; color: transparent; ..

发布时间：2022-08-05 20:15:05 html css css-animations keyframe 前端开发

如何防止在页面加载时运行css关键帧动画？

我有一个div，我在其中为内容制作动画： 数据-lang=“js”数据-隐藏=“假”数据-控制台=“假”数据-巴贝尔=“假”> #container { position: relative; width: 100px; height: 100px; border-style: inset; } #content { visibility: hidden; -web ..

发布时间：2022-07-22 22:31:59 css dom css-animations keyframe 前端开发

反转悬停时的关键帧动画

这里有一个演示： http://codepen.io/Tiger0915/pen/GgjVLN 我在.circlediv的hover上有一个keyframe动画。当您将鼠标悬停在其上时，它可以正常工作。 @include keyframes(bounce-bulge) { 0% { transform: scale(1); } 20% { transfor ..

发布时间：2022-06-30 11:02:24 css sass css-animations keyframe compass 前端开发

用于创建动画渐变按钮背景的CSS

我正在寻找可以为button's colored gradient background创建CSS动画的CSS规则。 我只是试着玩一下，然后这样做了：https://codepen.io/prashant-nadsoftdev/pen/bKzOrB。 .custom-btn { background: linear-gradient(105deg, #f6d365, #fda08 ..

发布时间：2022-03-10 10:39:22 css button css-animations linear-gradients keyframe 前端开发

有没有办法将变量从ReactJS传递到CSS样式表？

我正在编写一个组件数量可变的滚动滚动条，因此我需要它来更改translate3d根据组件数量移动它的距离。我能想到的唯一方法就是以某种方式向它传递JSX文件中的一个数字，但我找不到这样做的方法。有没有什么方法可以传递CSS变量，或者其他某种方式来完成我想要的操作？ 推荐答案 有几个« CSS in JS »库允许您向组件动画中添加keyframes。在JavaScript中编写样式时， ..

发布时间：2022-03-10 10:10:12 javascript css reactjs css-animations keyframe 前端开发

@keyframe不支持阿拉伯语

我尝试用@keyframe用阿拉伯语写句子，但@keyframe不支持阿拉伯语，结果出现难以识别的字符 .caption { background-color: black; } .caption h1::after { animation: move 3s infinite; content: ""; border-left: 1px solid #fff; ..

发布时间：2022-03-10 09:57:03 html css sass css-animations keyframe 前端开发

CSS @keyframe 动画在悬停时闪烁

寻求帮助！我为悬停状态制作的关键帧动画出现闪烁问题.我正在使用 Squarespace 并向网站添加自定义代码.行业设计师，请原谅我的代码，我被卡住了. 在此处查看网站:https://dingbat.co/new-fonts 悬停时闪烁问题 img {最大宽度:100%；}图像:悬停{不透明度:1！重要；动画:磨牙症1s无限；动画计时功能:步骤(100)；}@keyframes ..

发布时间：2022-01-22 22:03:12 css hover css-animations flicker keyframe 前端开发

从视频中提取关键帧

我需要从视频/流中提取关键帧.所以有没有标准的实现.我正在使用开放式简历.(目前我每秒都在提取帧，这比较慢，我需要提高性能.)因此，如果有人优化了实现，请在此处回复. 解决方案 使用ffmpeg可以提取所有关键帧，使用如下代码: ffmpeg -vf select="eq(pict_type\,PICT_TYPE_I)" -i yourvideo.mp4 -vsync 2 -s 160x ..

发布时间：2022-01-09 18:29:30 opencv computer-vision keyframe 其他开发

如何使用 FFMPEG 分割视频，以便每个块都以关键帧开头?

我们需要将大型实时 WMV 视频源分成大小相同的小块.我们制作了一个可以很好地执行此操作的脚本，除了一件事:视频块不以关键帧开头，因此在播放大多数视频块时，它们不会显示任何图像，直到原始视频的关键帧最终出现到达. 有没有办法告诉ffmpeg让输出视频从关键帧开始? 这是我们的命令行现在的样子: ffmpeg.exe -i "C:\test.wmv" -ss 00:00:00 -t 0 ..

发布时间：2021-12-21 14:04:11 video ffmpeg split keyframe 其他开发

使用 Javascript 变量设置 Webkit 关键帧值

我有一段 JS 代码来生成随机数并将它们作为变量输出，在这里用来代替旋转值 @-webkit-keyframes 旋转 {0% {-webkit-transform: 旋转(-10 度)；}100% {-webkit-transform: 旋转(10 度)；}}#狗{/*不相关的设置*/-webkit-animation:旋转 5s 无限交替缓入缓出；} 上面的代码工作正常，但是当我尝试将 j ..

发布时间：2021-12-13 20:54:59 javascript css variables webkit keyframe 前端开发

平滑停止 CSS 关键帧动画

我有以下代码:http://jsfiddle.net/odj8v0x4/. function stopGlobe() {$('.mapfront').removeClass('mapfront-anim');$('.mapback').removeClass('mapback-anim');}函数 startGlobe() {$('.mapfront').addClass('mapfront ..

发布时间：2021-11-10 05:42:00 javascript css animation keyframe 前端开发

如何防止css关键帧动画在页面加载时运行?

我有一个 div，我可以在其中对内容进行动画处理: #container {位置:相对；宽度:100px；高度:100px；边框样式:插入；}#内容 {可见性:隐藏；-webkit-animation:animDown 1s 轻松；位置:绝对；顶部:100px；宽度:100%；高度:100%；背景颜色:浅绿色；}#container:hover #content {-webkit-anima ..

发布时间：2021-11-10 05:34:42 css animation keyframe 前端开发

如何让css3动画永远循环

我想让整套动画永远播放.当最后一张照片淡出时，我希望第一张再次出现，以此类推.我所做的(我不喜欢)是将页面设置为在最后一张照片淡出结束时重新加载.有没有其他方法可以使用 css 来做到这一点??? .内容{高度:400px！重要；/*边距:自动！重要；*/溢出:隐藏！重要；宽度:780px！重要；}.imgholder{高度:400px；保证金:自动；宽度:780px；}.照片1{ ..

发布时间：2021-11-10 05:27:52 css loops animation keyframe forever 前端开发

如何在 MPEG-2 流中找到关键帧，打包在 MPEG-TS 中

我编写了 MPEG-TS 解复用器.它将传输流解包为 PES 数据包.现在我想删除所有帧，直到遇到关键帧. 我该怎么做?我应该在每个 PES 帧中找到 Sequence 块吗? 解决方案 您应该能够在 MPEG-TS 适配字段.如果您处理的传输流不使用 RAI bits，你需要依赖于包含的基本流中的信息.例如，如果您正在处理 H.264 流，则需要查找 IDR sliceNAL 单元 ..

发布时间：2021-09-17 20:02:41 video video-streaming keyframe 其他开发

在确切的关键帧停止故事板

我为我正在制作的一些游戏制作了一个骰子(在 c# 中)，它是一个用户控件，它使用故事板来依次显示多个图像(如幻灯片)，因此它看起来像一个滚动的 3D 骰子.问题是在特定的关键帧处启动和停止它.为此使用 Pause() 和 Resume() 似乎合乎逻辑，但我不知道如何在确切的关键帧处暂停. 有些人使用单独的 dispatcherTimer 来做到这一点，但这还不够精确，无法在那个确切的关​​ ..

发布时间：2021-08-30 20:02:54 wpf storyboard keyframe 其他开发

如何仅在使用 javascript/jquery 滚动时为引导程序进度条设置动画?

我想在滚动时为引导程序进度条设置动画(每次滚动动画时都应重新启动).我已经在 stackoverflow 上查找了解决方案，但是当我应用它们时，没有任何效果，因此进度条仍然“移动"而不是在滚动时而是在页面加载时.我想只使用 js/jquery 和关键帧而不使用任何库.如果有人有提示，那就太好了.谢谢！ https://jsfiddle.net/hdxv4hrp/ 代码:html: ..

发布时间：2021-06-21 20:33:48 javascript jquery twitter-bootstrap-3 progress-bar keyframe 前端开发

如何更改关键帧间隔?

如何使用FFmpeg将关键帧间隔设置为5秒? 解决方案 您需要重新编码.将x264的keyint参数设置为5 * fps，并禁用Scenecut.例如，如果您的fps为24: ffmpeg -i-vcodec libx264 -x264-params keyint = 120:scenecut = 0 -acodec复制出来.mp4 这显然不是最佳的质量，但可以满足 ..

发布时间：2021-05-06 20:39:02 ffmpeg keyframe 其他开发

如何防止CSS关键帧动画在页面加载?

我的页面上有一些带有关键帧的CSS动画，用于淡入/淡出元素.问题是当我加载页面时会显示淡出动画. HTML: 切换显示 我移动得很好！ CSS: .box {高度:0；不透明度:0；动画:FadeOut 1s缓入；}.box.active {高度:初始；不透明度:1 ..

发布时间：2021-04-27 19:09:45 javascript css css-animations keyframe 前端开发

点击即可来回运行CSS动画

使用css @keyframes ，我试图在单击元素时将一些动画附加到元素上. .animate {animation-name:动作；动画时间:2秒；动画定时功能:线性；背景颜色:绿色；}@keyframes操作{0％{背景颜色:灰色；}50％{背景颜色:红色；}100％{背景颜色:绿色；}} 演示 在单击时添加 .animate 类，该框从灰色变为绿色.但是现在，当我再次单击它( ..

发布时间：2021-04-26 19:39:25 css css-animations keyframe 前端开发

CSS幻灯片背景必须加载

我用关键帧为背景制作了一个简单的css幻灯片，我将图片的大小调整为每张约60kb(它们看上去很糟，但是我正在测试以查看是否可以使用)，但令我惊讶的是，这些图片没有用仍然要加载. 这是我幻灯片的CSS，不确定它是否可以帮忙，但我还是放了起来. body {背景尺寸:封面；动画:div 20秒无限；高度:100vh；边距:0;背景位置:中心；背景重复:不重复；背景混合模式:变暗；}html ..

发布时间：2021-04-26 19:12:59 html css keyframe 前端开发