使用动画css旋转为轮子

文章/答案/技术大牛

发布

1回答

jquery、html、css

我想使用animate.css旋转列表我有5个列表项。我保持第一个和最后一个列表项(0和4)不变，并旋转列表项(1，2，3)。我想用动画旋转列表项。我想像轮子一样旋转。我已经尝试过单击下一步按钮。动画效果不像预期的那样jQuery(document).ready(function($){ $('.thumbnailIcon500px;}

浏览 7提问于2017-02-28得票数 0

1回答

使用css动画的旋线器

css、css-animations、spin.js

有没有任何方法可以使用普通的css动画添加行旋转器(来自spin.js - )而不使用javascript (例如：)？

浏览 2提问于2018-04-12得票数 0

回答已采纳

1回答

如何根据拖动距离计算出旋转轮子的度数？

javascript、animation、css

我正在尝试创建一个动画轮子，用户可以使用CSS3变换和Javascript拖动来旋转。你如何计算出从给定的拖动距离将轮子旋转多少度？

浏览 3提问于2012-03-30得票数 0

回答已采纳

1回答

Div没有使用jquery关键帧围绕其中心旋转

javascript、html、jquery、css

我有两个轮子。轮子应该围绕其原点旋转，但它们做的是圆周运动，如下所示： ? 这是轮子的CSS代码： .wheel1 img{ position: relative;

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

回答已采纳

1回答

CSS动画-使物体100%水平旋转

css、animation、keyframe

我创建了一个CSS动画(飞猫)，但是当我将位置设置为%99，旋转(transform: scaleX(-1))为100%时，猫开始旋转为0%，结束于100%，我想在99%到100%之间旋转猫。

浏览 0提问于2016-04-05得票数 2

回答已采纳

1回答

点击AngularJS动画

angularjs、angularjs-directive、css-animations、angularjs-animation

我正在尝试添加一个指令，当元素被单击时会激活它，但是我的指令中的代码似乎从未触发过。 <img class="refresh" animate-spin src="refresh-icon-614x460.png">myApp.directive('animateSpin', ['$animate', function($animate) { element.on('click',

浏览 2提问于2014-05-02得票数 0

回答已采纳

2回答

jquery/javascript --键下/鼠标向下平滑动画的最佳实践

jquery、animation、smoothing

最好的方法是什么，或虽然我认为setTimeout和css()是正确的方式，但我似乎无法用它实现正确的平滑，更不用说，似乎吃了很多记忆。请注意，我不是试图在鼠标向下动画和鼠标停止，而不是动画从一个点到另一个点点击。

浏览 1提问于2011-11-07得票数 0

回答已采纳

2回答

CSS动画改变帧速率

css、css-animations、frame-rate

查看CSS动画，以取代加载轮子中的动画GIF。这将使动画的流动性更接近动画GIF的替换效果。这可以做到吗？

浏览 3提问于2013-05-12得票数 12

1回答

良好的JavaScript引擎，通过雪碧片动画(不是在帆布中)

javascript、jquery

我四处寻找一个伟大的JavaScript雪碧片动画库/引擎，但找不到任何好的，所以我想我会问一下=)。我在引擎里要找的是：外面有这样的引擎吗？如果不行，我总是可以自己做，但我不想再发明轮子了。

浏览 1提问于2012-08-28得票数 0

回答已采纳

4回答

CSS更改动画持续时间而不跳转

javascript、jquery、html、css、animation

我有一个轮子旋转的简单动画。我正在尝试使用滑块(输入范围)来控制旋转轮的速度。我已经设法做到了这一点，但每次我更改动画时，动画都会重新启动(它会跳转)。寻找一种解决方案来创造一个平滑的速度提升。在下面的代码中，#loading是一个旋转的轮子。 var speed = $(this).val(); $("

浏览 1提问于2017-12-01得票数 13

1回答

CSS 3D动画轮子偏离中心

javascript、html、css、css-animations

我有一个在x轴上旋转的3D css轮子/圆柱体动画。我的问题是动画似乎在它的容器之外上下移动。下面的GIF示例... ? angle * i }deg) translateZ(${ radius }px)`; class: 'wheel__segment'<div class=

浏览 11提问于2020-09-08得票数 6

回答已采纳

1回答

在下图中，粉红色的方块是10面“轮子”的容器。透视原点设置在每个div的中间。第一个问题(左轮)是轮子在div中没有垂直居中。我可以使用translateY来人为地将滚轮向下移动，但要转换的确切数量在不同设备之间会有所不同(例如，PC上的Chrome与Android上的Chrome不同)。为什么轮子没有垂直居中？第二个问题(右轮子)是，如果我将轮子的高度设置为1em以外的值，并沿X轴旋转轮子，轮子不会从其中心旋转，因此看起来像是在div内摆

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

回答已采纳

1回答

HTML交互式图形控制盘

jquery、html、svg、jquery-animate、css-animations

如何在网站的动画上进行交互式悬停，如下图所示？

浏览 14提问于2018-08-22得票数 0

1回答

如何在事件被调用后延迟函数的执行？

javascript、javascript-events、spinner

removeClass('spin'); } $('#inner-wheel').css

浏览 1提问于2015-08-16得票数 1

1回答

如何实现Google Play Books中使用的页面卷曲类型？

java、android、animation、opengl-es

我一直在寻找一种合适的方式来模仿iOS应用程序中使用的那种翻页/卷曲，但在安卓应用程序中使用。我在Android上看到的最接近的东西是Google Play Books应用程序。我看到的大多数示例都是使用某种基于OpenGL的RenderView构建的。这可能会起作用，但我必须确保屏幕不会被徒劳地渲染，因为我不想使用太多的电力。另外，在处理非pow2的纹理时，我有点害怕使用OpenGL。致以最好的问候，Kalle

浏览 1提问于2013-08-19得票数 8

1回答

重置transform: rotate()而不调用-webkit-transition: style

javascript、css、canvas、rotation

我正在画布上画一个轮子，旋转它，然后想要将旋转重置为0。非常感谢$("#wheel").css("transform","rotate("+r+"deg)");$("#wheel").css</em

浏览 0提问于2016-05-04得票数 1

1回答

关于用CBasicAnimation实现物体中心旋转的问题

iphone-sdk-3.0

我试着让一个轮子绕着它的轴旋转--用鼠标将它设置为运动状态。具体地说，我正在尝试旋转轮盘赌轮。myview.layer添加动画:fullRotation forKey:@"360"；上面的代码给了我流畅的动画，但轮子</e

浏览 2提问于2009-12-27得票数 1

2回答

在css中制作一个带虚线边框的圆，并在悬停时设置动画

html、css、css-transitions

我正在尝试制作一个css圆的动画。当用户悬停它时，圆的边框应该变成一条虚线，并且它应该像旋转的轮子一样动起来。我可以让它在给定的时间内旋转，但我找不到一种方法来制作它的动画，直到鼠标指针悬停在它上面，然后当鼠标指针移出圆圈并制作一个虚线边框时停止动画。html</div>div { border: 5px solid green; hei

浏览 4提问于2013-06-22得票数 2

回答已采纳

1回答

AS3的幸运之轮

actionscript-3、flash、animation

我附上了轮子的设计。我不是一个程序员，我是一个设计师，我需要做所有的动画和效果，但我想做的专业，这一部分是非常重要的。我想要做的是，当你点击旋转按钮，轮子旋转4-5秒，轻松进入/退出效果，并停止每次在不同的随机扇区。我会在单独的电影剪辑中为每个扇区做不同的动画，当它停在一个扇区上时，我希望与该扇区相关的电影剪辑开始播放。我的想法是使轮子作为一个电影剪辑，每个地段动画电影剪辑嵌套在其中，这样当它停止时，特定的电影剪辑开始。也许我需要在关键帧上设置轮子的每个位置，

浏览 0提问于2016-06-23得票数 0

2回答

css3用scaleX和scaleY动画？

jquery、css

好吧，我想要的东西，我需要缩放和移动！同时有一个对象，现在我有了这样的东西： top: pxToMove.top+"px",},1000});-webkit-transform: scaleX(1.8) scaleY(1.8);-moz-transform: scaleX(1.8) scaleY(1.

浏览 2提问于2014-06-24得票数 0

回答已采纳

点击加载更多