CSS -webkit-mask-position只响应一个动画

文章/答案/技术大牛

发布

1回答

css、css-animations

我在制作蒙版的x和y位置动画时遇到了一些问题。 #middle{ -webkit-mask-image: url("waveMask3.png");

浏览 18提问于2019-11-08得票数 0

回答已采纳

1回答

使用javascript在webkit遮罩位置动画之间等待5秒

javascript、css、webkit、css-animations、css-mask

我正在做一个CSS闪亮的图标效果，到目前为止，我已经创建了使用webkit掩模效果，下面是我的代码片段 .hm-instagram:before{ -webkit-mask-size: 200%;} from { -webkit-mask-position: 150%; } to { -webkit-mask-positi

浏览 21提问于2021-08-01得票数 0

1回答

优化使用CSS蒙版的CSS3动画

html、css、animation

我正在制作一个基于CSS3的动画，其中我有一个以线性渐变为背景的div，然后我使用-webkit- mask -image属性使用PNG作为遮罩。@keyframes moveMask { 100% { -webkit-mask-position

浏览 2提问于2012-12-21得票数 3

1回答

通过javascript更改-webkit-mask-position

javascript、css、mask、css-mask

我正在做一个iPad webview项目，它需要一个滑块在两张图片上来回移动，当向左或向右滑动时，会显示出其中的一个。由于项目的限制，我不能使用jQuery。我目前在顶部有一个透明遮罩的左边的图片，当-webkit- mask -position增加时，它显示更多的底部图片，当减少时，更多的顶部(覆盖底部)。我正在使用一个名为Draggy ()的javascript插件来回移动滑块，并希望使用它的onChange函数调用来更新蒙版的位置，但我不知道javascript如何调用"-webkit-

浏览 1提问于2012-08-07得票数 3

回答已采纳

1回答

Vuejs的CSS掩码转换

css、vuejs2、css-transitions

我一直试图重新创建这个掩码css效果作为路由器视图转换。任何帮助都是非常感谢的。谢谢。我已经创建了这个Vue页面，css效果在页面加载期间工作，我只需将两个div放在另一个页面上，并将css应用到顶部。(下面的代码作为两个div相互之间的CSS转

浏览 2提问于2017-11-06得票数 0

回答已采纳

1回答

CSS蒙面动画看上去非常紧张

css、css-animations

我想创造一个效果与CSS掩蔽，其中蒙面图像移动非常缓慢，而面具形状保持静止。现在我正在用相反的动画来做，但是你可以看到它看起来很紧张.任何想法或建议都是非常感谢的！我也不反对非CSS的解决方案。eyJhcHBfaWQiOjEyMDd9&s=178c7b6760bd80795174675611b673c1&auto=format&fit=crop&w=1055&q=80" class="mask"/><

浏览 0提问于2018-03-07得票数 1

回答已采纳

4回答

谷歌是如何在出现的“阻止所有foo.com结果”链接上“发光”的？

google

复制：遵循第一个结果。在我使用Chrome登录到Google的时候，所有的网站都会出现这种情况。这是如何实现的？

浏览 0提问于2011-06-14得票数 19

回答已采纳

1回答

如何改进掩模图像页面的转换？

javascript、css、svg、css-transitions、css-mask

: 0 0; to { -webkit-mask-position: 100% 0;} 0% { -webkit-mask-position: 100% 0; 100% { -webkit-mask-position: 0 0;}

浏览 6提问于2020-07-13得票数 3

4回答

如何动画ajax/json响应？

javascript、jquery、css、json

这是我的HTML代码 <div class="q_div"></div></div> 我发出一个Ajax请求，并为用户的每次单击获得一个json响应，并使用jquery函数追加q_div和a_div。$('.q_div').append(data.q

浏览 0提问于2016-09-14得票数 4

回答已采纳

1回答

CSS keyframe shimmer效果可以在Chrome中使用，但不能在Firefox中使用？

html、css、effect、shimmer

"><img src="someImage"></a></div> CSSbackground-repeat: no-repeat;}

浏览 31提问于2021-11-09得票数 0

1回答

使用透明梯度掩码制作css动画

javascript、css、css-animations、css-mask

我目前正在制作一个动画，它将在图像上应用渐变掩码。面具是一个透明的面具，它将从图像的右到左转换。这是我的密码。 -webkit-animation: rightToLeft 5s forwards; 0% { mask-position: 100vw 0%; } -webkit-mask-po

浏览 12提问于2022-05-21得票数 0

回答已采纳

2回答

图像CSS的切割部分

javascript、css

我尝试创造一个小故障图像动画效果。因为我想要达到取代一幅画的效果。background-image: url(https://clipart-db.ru/file_content/rastr/bmw_002.png)" alt=""></div> CSS

浏览 0提问于2021-06-10得票数 2

回答已采纳

2回答

Webkit-掩码-大小不起作用

css、webkit

/css/images/myimage.png) center center;应用了myClass的div有一个设置了固定高度的父容器。

浏览 1提问于2013-08-29得票数 5

回答已采纳

3回答

在卡体文本悬停时如何在卡体内滚动文本

javascript、html、css

我有一个引导带5 card-body与一个card-title和card-text与文本内的card-body类。如何将CSS样式设置为使card-title在card-title上悬停时自动水平滚动<div className="card-body "> <h5 style={{ textAlign

浏览 8提问于2022-04-01得票数 0

2回答

HTML响应与旧html的比较

jquery、ajax

我有一个来自使用jQuery的AJAX请求的响应作为' response‘返回 { $("#container").css({"border":"

浏览 1提问于2010-05-23得票数 0

1回答

你能为webkit-mask-box-image使用CSS精灵(或者裁剪它吗？)

css、sprite、css-mask

我正在使用-webkit-mask-box-image css属性。我最终得到了一个遮罩图像形状的红色元素。但是我想不出一个好的方法来用掩码属性做到这一点。这是可行的吗？我想出的一个解决方案是使用类似如下的标记： width: 100px; he

浏览 5提问于2011-07-05得票数 5

回答已采纳

2回答

如何在不剪切.svg图标的情况下显示它？

html、css、image、svg、vector-graphics

我试图在我的网站上显示社交媒体图标，这样我就可以使用css改变颜色(这样我就可以添加下面代码中显示的悬停效果)。因此，我继续创建CSS类，以使图像显示为CSS掩码(从而允许我通过CSS更改颜色)。然而，我很快注意到，否则的圆形矢量图形图标的侧面是轻微的截止。作为一个完美主义者，我想让这些图标看起来像他们应该看到的那样。因此，在签出之后，我增加了.media-buttons类的宽度，并使用-webkit-mask-position将图像向下和向左移动几个像素，如下面的代码所示。这显然是行

浏览 0提问于2016-02-25得票数 0

回答已采纳

1回答

在React.js中使用CSS动画

css、reactjs

我已经和React一起工作了一段时间了，但是动画是一件让我困惑的事情。目前，我使用CSS在我的反应组件。每个组件导入一个css文件，用于样式化，而不是使用内联css。我的问题是:如果我有一个页面，就像一个没有状态更新的登陆页面，那么在css中使用关键帧动画和类似的东西是否可以呢？边问:对于一个不更新的页面，我是否可以像登陆页面那样使用关键帧，或者对于更复杂的页面，它会完全崩溃吗？

浏览 2提问于2016-06-03得票数 3

回答已采纳

1回答

激活特定滚动位置的动画

javascript、jquery、html、css、animation

我正在创建一个简历页面，其中我包括动画-其中一些工作与额外的库:动画css。它可以工作，但是动画是在页面完全加载时开始的--我希望它们在滚动到div开始位置时发生(它位于页面的中间)。我尝试过用元素.scrollTop来实现这一点，但是我可以只在px中包含值--我需要响应页面(我使用calc() )--也有可能我做错了什么--但我没有注意到就像我说的-我想开始动画时，div将成为范围内的视线

浏览 0提问于2019-05-21得票数 0

回答已采纳

1回答

浏览器兼容的旋转木马

carousel

我是网页设计的新手，学习了超文本标记语言、CSS和JavaScript的基础知识，正在创建一个博客网站。我正在使用Bootstrap来格式化我的页面，并想添加一个carousel，然而，Bootstrap carousel与某些IE浏览器不兼容。考虑到广泛的兼容性是我的目标，我应该如何向我的网站添加一个旋转木马？CSS？JavaScript？

浏览 3提问于2015-11-13得票数 0

点击加载更多