css-animations

1热度

1回答

我有一个简单的卡片翻转动画，在我测试的浏览器上运行良好。然而，当这张卡片翻转动画发生在另一个也是动画的div上时，Safari上还存在一个问题。出于某种原因，Safari在卡片翻转时会消失在“背景div”后面。我认为这可能是一个z-index问题，但从我尝试过的不是。为了使示例变得简单，背景div是灰色的。这个想法是在背景中发光。下面是我有的代码示例，我已经在Chrome，Firefox和E

0热度

1回答

转换SVG的SMIL动画CSS3动画

我现在的SVG使用SMIL动画 <svg viewBox="0 0 64 64"> <g> <circle r="5" cx="24" cy="0" transform="translate(32,32)" stroke-width="0"> <animate attributeName="fill-opacity" dur="750ms" values="1;.9;

0热度

1回答

摆脱动画的css抖动

任何人都可以帮我解决如何摆脱css抖动？ HTML浏览： <div class="carousel-inner"> <div class="item"> </div> </div> 此处的CSS： .carousel-inner { position: relative; overflow: hidden; width: 100%;

0热度

2回答

如何加快我的CSS垂直滑块中的幻灯片？

我需要一个可以在垂直方向移动幻灯片的滑块。我的代码问题是幻灯片之间的转换太慢。每张幻灯片应至少保持5秒，下一张幻灯片之间的过渡应该非常快，就像我们在光滑滑块等中看到的那样。 #slideshow { position: relative; width: 200px; height: 20px; border: 5px solid #fff;

0热度

1回答

动画滞后，由于混合，混合模式属性在Chrome

如果启动Chrome和检查我在全屏模式下小提琴，你会看到动画是laggy。 div滑落一点，文字滞后一点点。如果您将浏览器的大小调整得较小，则动画效果会很好。另外我的动画在Safari中运行良好。如果删除.light-leaks类，它包含了mix-blend-mode属性，动画将运行正常。什么问题？谢谢。 fiddle fiddle in fullscreen mode

0热度

3回答

CSS动画，点击启动和停止无限动画

有没有办法做到这一点没有JavaScript或我必须使用JS从对象追加/删除类？你们能向我展示一些现场实例吗？现在我有一些作品只在对象的悬停： .clicker:hover + .circle { -webkit-animation: rotor 1.5s linear 0s infinite normal; -mox-animation: rotor 1.5s linea

0热度

2回答

CSS平滑移动动画无法正常工作

css动画代码无法正常工作。当#tools_button被选中时，我希望#tools_hidden变得可见并且从顶部移动：0％到顶部：6％顺利。下面是代码： #tools_hidden { position: fixed; left: 10%; top: 0; display: none; -webkit-transition

0热度

2回答

CSS动画填充模式不适用于显示：无

我有以下代码来显示/隐藏基于css类的传送带上的按钮。一切按预期工作，除了hideButton之外，动画完成后显示未设置为“无”。效果是，尽管按钮消失，它仍然位于基础项目之上，并防止点击击中它们。 .pills-tab-carousel__button { position: absolute; top: 0; height: 100%; line-hei

0热度

3回答

如何水平滑动元素

我需要向点击函数添加一个else语句，以便.container在第二次单击按钮时消失。 function() { $('div.container').css({'width':'350px'}); } else { $('div.container').css({'width':'0'}); } }); 编辑：我需要切换向左滑动按钮上点击

0热度

1回答

当兄弟被删除时，如何让HTML div动画变得平滑过渡？

我想实现的：我正在处理我的页面上的CSS/JS动画。小提琴=>https://jsfiddle.net/hngz8rq4/ 的HTML <div class="container"> <div class="mock-requests"> <div class="mock-request"> <div class="mock-request-inner">