CSS技能栏动画

文章/答案/技术大牛

发布

1回答

html、css、css-animations、keyframe

我正在尝试创建一个技能栏，其中进度的背景颜色滑动，但技能栏的标签留在相同的位置。 skill.skill-level-70 {} <div class="skill-container"> </div> 到目前为止，动画运行得很好，但我唯一需要弄清楚

浏览 12提问于2021-01-22得票数 2

回答已采纳

1回答

滚动上的CSS技能栏动画

javascript、jquery、html、css、animation

此外，第二个示例中提供的动画代码要干净得多--总的来说，第一个示例有点凌乱、代码繁重和冗余。编辑:另外，如果你有任何建议，在你缩放页面时，阻止栏“打破”它们的容器(这个网站是为了响应)，我也将不胜感激。

浏览 4提问于2013-10-13得票数 0

1回答

在CSS中用动画停止技能栏

html、css、css-animations

我做了一个技能条，但它并没有停在它应该停止的地方，我的意思是，如果你在关键帧中输入60%，那么在动画中，技能条会在60%内停止，但是它会更丰富的颜色。</svg> <div class="container"> }

浏览 4提问于2022-11-24得票数 0

1回答

在我的反应项目中，我有一个折叠的边栏菜单，顶部有一个徽标。我想添加一些功能，在折叠的侧边栏上盘旋，将徽标转换为基本的汉堡包菜单，然后在鼠标离开侧边栏时返回到徽标。我可以访问一个可以创建动画资产(例如GIF)的设计师，但我不知道如何用GIF实现这样的东西。在我有限的网络项目动画经验中，我觉得能够以某种方式使用CSS动画进行转换是非常理想的，但我没有自己的技能，我不认为这是设计师能做的事情。其他动画格式？，如果CSS是最

浏览 4提问于2022-10-28得票数 0

回答已采纳

1回答

触发器动画元素达到div ID

css、animation、triggers、launch、animated

我正在寻找使用Jquery触发css3动画的解决方案或教程。有没有人可以帮我或者给我一个很棒的教程？干杯, 乔恩

浏览 1提问于2013-04-11得票数 0

回答已采纳

1回答

技能栏的SMIL动画

svg、jquery-animate、smil

我已经找了好几个小时了，我就是不明白为什么我不能在SMIL中找到一个动画技能栏的解决方案。我知道如何使用JS和CSS，但我不敢相信这不适用于animate。有什么想法吗？

浏览 6提问于2018-06-17得票数 0

1回答

滚动动画技巧条

javascript、jquery、css、ruby-on-rails、animation

在我的应用程序中，我有技能栏，当网站加载时，这些技能条都是动画的，而且一切似乎都正常。我想让它动画当我滚动到技巧条。我正在使用库animate.css。 $('.progress-back').each(function() { '.progress-full-line-over').css').ea

浏览 0提问于2017-08-08得票数 0

回答已采纳

1回答

我怎么能动画这个Raphael SVG图表技能栏？

jquery、css、animation、svg、raphael

我想使用以下链接中的Raphael技能栏：我怎么能这么做？

浏览 3提问于2015-03-26得票数 0

3回答

带有计数器的动画进度条

html、css、css-animations

拜托，有人能帮我创建一个像下面的图片一样的动画进度条吗？ </div></div> 下面是我的css

浏览 2提问于2017-05-07得票数 0

回答已采纳

2回答

只在滚动时播放CSS动画

javascript、jquery、html、css、animation

我有一个页面上的内容和一半的方式，我有技能条，是与CSS动画。我只想播放动画时，技能条是可以看到的。我试着使用js，当我使用一个技能条时，它起了作用。

浏览 0提问于2013-08-27得票数 2

回答已采纳

3回答

CSS技能栏响应式

javascript、html、css、media-queries、responsive

所以我终于把一些内容创建的东西放到我的第一个移动和桌面响应式网站上，我想知道如何让技能栏在移动设备上更具可读性。他们没有任何关于如何使此技能栏响应的信息。这就是我的目标。w3schools 这是我的桌面版本现在的样子 ? 但是当我进入Dev模式以iPhone格式查看它时，它看起来是这样的 ? : right; color: white; width: 90%;} .css</e

浏览 25提问于2019-01-23得票数 2

回答已采纳

2回答

Javascript:如何创建CSS3动画

javascript、jquery、css

我目前正在努力弄清楚如何为我正在做的RTS创建一个实时战斗的战斗系统栏。该条将移动与CSS3动画6秒，然后变成绿色，允许您采取行动。但我需要它的一种方式，技能将触发时，时间条是满的。<div id="atbbar"> </div> document.getElementById

浏览 1提问于2013-10-04得票数 2

回答已采纳

1回答

悬停时的动画圆形条

jquery、css、jquery-animate、geometry

我正在建立一个投资组合网站，并希望实现一个技能集页面，其中有一个动画圆形栏，代表我的每一个技能。当用户悬停在圆圈周围时，将有6个按钮，当其中一个按钮悬停时，我想要一个圆形条来逆时针动画。我发现这个网站在顶部的左侧有一个类似的概念，一个动画饼图-- 这是我在photoshop中做的一个快速.gif模型，它是我想要实现的目标--

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

回答已采纳

1回答

动画HTML/CSS/jQuery技能图

jquery、html、css、graph

因此，我正试图制作一个“技能”图形，当页面打开时加载。 $('.html').css('width', '100%'); $('.css').css('width', '100

浏览 5提问于2014-02-06得票数 1

回答已采纳

1回答

页面滚动中的技能栏动画

jquery、html、css

如何在页面滚动的特定部分实现技能条动画。我已经尝试做一个滑动技巧条动画，但没有弥补我想要的效果。它开始动画在开始页面，但我希望它开始动画在特定的页面部分滚动。在下面的代码中，我希望在第三秒的页面滚动中启动动画。但这是不可能的。请用附加的固定代码片段修复代码。data-percentage="90%"> <

浏览 2提问于2017-08-28得票数 0

1回答

动画基础5下拉菜单

javascript、jquery、css、zurb-foundation

我没有看到任何可以让dropdown动画的选项。它就这么出现了。data-options有没有某种属性。

浏览 1提问于2015-01-17得票数 0

1回答

如何使用jquery显示和隐藏此加载栏

jquery、css、animation、loading

我想在我的网站上使用这个加载动画，但是当我使用jquery进行show()和hide()时，我没有得到想要的结果。此外，.css('display', 'block')和.css('display', 'none')也没有达到预期的效果。我假设这是因为css :not和:before的操作方式，但我的css技能不是很好，所以我不确定。加载动画代码：document.onscro

浏览 11提问于2018-01-22得票数 0

2回答

关于Scroll动画技能栏不工作

javascript、jquery、html、css、scroll

我正在处理我的作品集，我被卡住在动画技能栏中。我正在使用JQuery，我遵循了不同的教程，但没有一个在我的项目中不起作用。我有计算节滚动位置和窗口滚动位置。我更改了父div和子div，但结果是相同的。<div class="my-skill"> <i class="fab fa-css3-alt fa-lg"><&#

浏览 0提问于2020-03-05得票数 0

1回答

Javascript:如何确定转换时间的目标？

javascript、css

我创建了一个类似于时间条的css3动画。当时间条结束(或动画结束)时，玩家应该能够选择要使用的技能。我现在遇到的问题是创建的代码可以让我选择特定的时间并随意修改，因为我在CSS动画中使用的是速记代码。我这么问是因为我想影响其他技能，比如timestop或timeslow等。谢谢你的JQuery，但我正试着在没有它的情况下做到这一点，还在学习javascript。

浏览 2提问于2013-10-14得票数 0

1回答

实现自定义CSS技能栏

html、css、bootstrap-4

我正在做一些css和引导，作为我学习的一部分。我的任务是创建一个小的基于简历技能的图表。下面是我试图重新创建的示例图像。以下是我迄今为止所取得的成就。 <li id="skill-html" class="skill-list">Skill 1</li> <li id=

浏览 0提问于2020-01-18得票数 2

点击加载更多