我有困难旋转一个项目在webkit的完整360度使用CSS过渡。
我已经创建了一个JS Fiddle来显示我想要做的事情：
过渡应该在两个步骤中进行。首先，物品应该沿着Y轴旋转1/2圈。然后，一旦过渡完成，它应该将相反的方向旋转一整圈，并缩小到原始大小的一半。我遇到的问题是，第二个转换只是缩放，而不是旋转，即使rotateY(-360deg)和rotateY(0deg)的rotate值应该会导致完全旋转。
这只是一个概念验证，所以我目前只针对webkit。然而，我想坚持转场，而不是关键帧动画。有什么想法吗？
浏览 1提问于2012-04-27得票数 2
回答已采纳
2回答
我对Bootstrap很陌生，我正在尝试制作一个图像旋转木马，问题是在旋转木马项目之间没有平滑的滑动，所以它在没有过渡动画的情况下从一个项目切换到另一个项目。
请查看现场演示
jQuery代码：
$(document).ready(function() {
$('.carousel').carousel({
interval: 2000
});
});
JS档案：
<script src="js/jquery-1.9.1.js"></script>
<script src="js/bootst
浏览 6提问于2014-09-25得票数 0
回答已采纳
我有一个chart.js饼图。当我更新数据集时，我希望饼图段平滑地调整大小以适应新值(即增大/缩小大小)。 饼图每次都会执行旋转过渡。在设置新数据后，我可以使用.update('none')关闭旋转过渡，但随后饼图立即发生变化，没有过渡。 有没有办法做到这一点？ 我的饼图设置代码是： chartRegion_Emissions_ANZIC_BreakdownChart = new Chart(ctx, {
type: 'pie',
options: {
responsive: true,
浏览 28提问于2021-07-24得票数 0
我有一个定制的旋转测试在Nexus 7 (Marshmallow)和Moto X 2014 (棒棒糖)，一切都应该工作。但是，当我在Nexus 5或5X (Marshmallow)上测试时，旋转器的下拉箭头没有显示。我玩过各种各样的排列和填充，但这似乎没有什么区别。
我的旋转XML：
<Spinner
android:id="@+id/spinner"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
androi
浏览 5提问于2016-03-30得票数 2
回答已采纳
我正在使用impress.js创建一个3D效果，在其中你是在四页，就像他们是在一个房间的四面墙。要查看下一页，使用简单的-90度旋转。这些页面已经使用impress.js进行了布局，使用：
//page 1
<div id="title" class="step" data-x="0" data-y="0" data-z="0">
//page 2
<div id="about" class="step" data-x="2000" data-y=
浏览 4提问于2012-07-02得票数 4
2回答
我正在使用这个过渡为一个轮子做一些旋转：
transform: rotate(180deg);
transition: transform 10s cubic-bezier(.5,.1,.15,1);
现在，我如何使用JS检测转换的发送？
谢谢。
浏览 2提问于2019-06-26得票数 0
试图在华硕笔记本电脑上安装17.10。16.04工作良好，但17.10靴子90度(屏幕旋转，就像一个平板被旋转)。笔记本电脑是一个转换类型，所以如果我旋转是旋转屏幕。
浏览 0提问于2018-02-23得票数 1
2回答
让div在点击时旋转的最好方法是什么，但要有一个过渡？
我试过了，但它只在添加类时进行平滑过渡，而不是在删除类时：
js：
$('#firstDiv' + id).click(function(){
$("#Img" + id).toggleClass('rotated');
});
css：
.rotated {
-webkit-transform: rotate(-90deg);
-moz-transform: rotate(-90deg);
-o-transform: rotate(-90deg);
浏览 31提问于2020-02-06得票数 0
回答已采纳
1回答
我正在研究一个轮盘赌轮，它分两阶段旋转。
1)当用户单击spin按钮时，它只是进入无限旋转，直到数据来自服务器。
2)当数据到达时，只需按从服务器获取的角度旋转即可。
我们从服务器获取数据，因为它包含一些我们不想发送到客户端的敏感信息。
我面临的问题是，从1)到2)的过渡并不是无缝的。旋转器意外地停止了随机时间，然后启动2) (有限旋转)。
下面是我的js小提琴，它是场景最简单的复制。
html：
<div id="spinning" style="background-color: red; display: inline-block">
a
浏览 3提问于2018-12-01得票数 2
1回答
我对比赛的时机有异议。当第一次单击“开始”按钮或用户在再次单击该按钮之前等待足够长的时间时，所有操作都正常。
否则，只有音频触发，但旋转过渡不。旋转转换使用transit.js创建。
我试过在tock循环的末尾和重置按钮上使用clearQueue，但没有任何效果。
我试图实现：-所有动画队列清除时，启动或重置按钮被点击。
浏览 3提问于2013-07-30得票数 1
回答已采纳
我最近发布了我的主页，其中我使用旋转木马+推特引导+ retina.js。
当我用我的旧MacBook Pro (非视网膜)访问这个页面时，它会显示出预期的旋转木马。三个图像自动显示与一个很好的过渡。但是当我用我的视网膜MacBook Pro (Safari6.0.3+OS10.8.3)打开相同的页面时，就不会显示一两个图像。
Retina.js似乎与我的视网膜MacBook Pro正常工作，因为下面页面中的图像会自动更改为我的图片的高分辨率版本。因此，我认为旋转木马和retina.js的结合在某些条件下是行不通的。
即使在我的视网膜Mac上使用Google (26.0.1410.65)或
浏览 3提问于2013-04-27得票数 4
回答已采纳
一旦进程完成，我需要从元素中删除fa-spin类。
问题是纺丝图标和非纺丝图标之间没有过渡.
setTimeout(function() {
stopSpinner();
}, 2500);
function stopSpinner() {
$('i').removeClass('fa-spin');
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<i class=&#
浏览 0提问于2015-01-16得票数 2
回答已采纳
$(document).ready(function() {
$(".r-product-page #menu > li > a").click(function() {
$('ul.sub-menu').not($(this).siblings()).slideUp("slow");
$(this).siblings("ul.sub-menu").slideToggle("slow", function() {
$(this).siblings('.dro
浏览 2提问于2017-10-04得票数 0
回答已采纳
我使用D3.js，Javascript，特别是函数d3.geoOrthographic来创建地球。 我已经创建了一个地球，现在我正试图将它旋转到某些国家。例如，从"UK“开始，然后转到"China” 我每隔一段时间就这样做。 d3.interval( () => {
projection.rotate(coOrdinates)
path = d3.geoPath().projection(projection)
map.selectAll("path")
.attr("d", path)
}) 这很有
浏览 19提问于2020-09-09得票数 0
1回答
我有一个图像旋转木马，你可以滚动通过一个‘下一步’和‘上一步’按钮。这些按钮正在设置位置状态。位置状态被传递给样式化组件，并作为子元素的"transform: rotateY“属性数组。可以在此处找到包含相关代码的代码片段：https://codesandbox.io/s/hardcore-microservice-eylul?file=/src/App.js 我的目标是在单击next和prev按钮时，使旋转木马中图像的过渡变得平滑。
浏览 20提问于2021-04-22得票数 1
回答已采纳
2回答
我正在锻炼，并尝试在纯JS上编写自己的旋转木马。
window.onload = function () {
var slider = document.getElementById('slide-list');
var left = document.getElementById('rewind');
var right = document.getElementById('forward');
var clickDisabled = false;
function spin() {
浏览 3提问于2015-05-22得票数 4
2回答
出于性能和美学上的原因，我正在用CSS转换(旋转)将画布中的Paper.js“绘图”转换成画布。基本上，在卷轴上，画布旋转，有一个过渡的持续时间来平滑它。
最重要的是，我的Paper.js路径上有鼠标事件，所以在悬停时它们会改变颜色。然而，当CSS转换应用于画布时，鼠标事件“消失”，因为缺少一个更好的词，而且它们不能工作。我想，在这条线的某个地方，CSS转换正在处理画布绘制的元素，但在Paper.js创建的与我的路径绑定的鼠标事件上跳过或应用不同。有什么解决办法吗？
浏览 10提问于2016-02-06得票数 0
回答已采纳
7回答
我想知道有没有人能帮上忙。我正在使用CMS的旋转木马，并希望客户有时只有一个幻灯片的能力，如果他们希望这样做。然而，如果只有一张幻灯片，淡入淡出过渡仍然会发生，所以它基本上会过渡到自己。当只有一张幻灯片时，有没有办法停止旋转木马的过渡？令我惊讶的是，这不是一个内置的函数，就像我使用过的其他轮播一样。
<div id="owl-demo" class="owl-carousel">
<div class="item">
<h2><umbraco:Item field="bigMess
浏览 0提问于2013-11-17得票数 7
2回答
我希望我的移动菜单上的向下箭头旋转180度，点击时朝上。我还想为平滑过渡设置旋转动画。我正在使用Javascript在我的".fa-angle-down“字体类上切换一个".js-rotate”类。
JS函数中的最后一行控制此行为：
nav.addEventListener('click', (e) => {
if (e.target.classList.contains('nav-list-drawer__btn')) {
e.target.classList.toggle('js-nav-list-drawer__b
浏览 3提问于2018-06-05得票数 2
1回答
我创建了猫头鹰旋转木马幻灯片，需要做的是幻灯片之间的过渡不被注意，缓慢而连续地移动。有 (幻灯片在页面底部)
如果这不能做到这一点，猫头鹰旋转木马滑块可以做这样的幻灯片过渡。
浏览 0提问于2017-09-25得票数 1
根据这个幻灯片之间的过渡效果，可以有“旋转”、“淡出”、“圆形”等等。我已经在用FB3.1了。
目前在下面的代码中，我已经将过渡效果设置为旋转，但它不起作用。请告诉完整和准确的代码和它应该放在哪里。因为我对JS非常陌生，因为我只知道HTML和CSS。
$.fancybox.defaults.loop = true;
$('[data-fancybox="project1"]').fancybox({
slideShow : {
浏览 7提问于2017-06-07得票数 1
2回答
我是一个全新的d3新手，到目前为止我很喜欢它，但我正在尝试将一些东西组合在一起，不知道如何纠正某些行为。
这是我正在尝试做的一个演示：
删除死链
第一种行为是每个仪表的“起始点”始终默认为黑色，颜色从那里过渡。
第二种行为是旋转之间的过渡“反弹”。这是因为它不是围绕(150,150)旋转，而是围绕(0,0)旋转，这使得它在过渡中“反弹”，但我不知道如何解决这个问题。
有没有人能帮我看看我哪里错了？
谢谢。
浏览 0提问于2012-11-13得票数 0
回答已采纳
我正在进行一个过渡，将宽度过渡和旋转过渡结合起来。
问题是，在Safari和Chrome中，过渡非常不稳定。
正如您所看到的，在转换过程中会出现一个滚动条，我猜这与此有关。当我将父服务器设置为overflow:隐含时，滚动条是不可见的，但抖动仍然存在：。
当转换只在旋转时，就不会有抖动:参见"index3.html“(对不起，还不允许发布3个链接)
我使用的是jquery.transit库，但是握手也使用普通的css-way。
浏览 2提问于2014-06-11得票数 0
回答已采纳
我正在开发一个应用程序，当它旋转到左边时，会显示一个viewController，然后当它旋转到右边时，它会显示另一个视图控制器。我的segue的风格是模态的，我使用的是交叉融合过渡。问题是，当我向左旋转，然后快速向右旋转时，控制台向我发送以下警告：
Warning: Attempt to present <SSGraphRightViewController: 0x81159b0> on <UINavigationController: 0x82439a0> while a presentation is in progress!
有什么方法可以避免这个警告吗？也许可
浏览 0提问于2013-04-06得票数 2
回答已采纳
考虑一下这个JS函数：
function myFunc() {
const date = new Date();
const secs = date.getSeconds();
const secDeg = 360*(secs / 60)+ 90 ;
hand.style.transitionDuration = '0s';
hand.style.transform = `rotate(${secDeg}deg)`;
hand.style.transitionDuration = '2s';
}
我希望在0秒的过渡时间内完成旋转。然而
浏览 4提问于2016-12-13得票数 1
回答已采纳
2回答
为了在我的应用程序中实现页面过渡，我添加了工具包旋转门动画，在添加过渡之前，应用程序是稳定的，我没有遇到任何内存问题。在实现了工具包的过渡动画之后，内存就像珠穆朗玛峰一样在不断增加。我想虽然内存释放的过渡时间没有发生，但有没有人能为我提出一个解决方案来解决这个问题，或者指导我在我的应用程序中以另一种方式实现旋转门动画。希望他们中的许多人能够面对这个问题并得到解决。所以请帮帮我。提前使用ThanX
浏览 0提问于2011-12-21得票数 0
我已经完成了我的Javascript游戏/应用程序，在没有错误或警告的情况下运行构建后，我确信Certification SDK会以优异的成绩通过我的测试。相反，它给我带来了两个失败，都与一些教程推荐用于开发Win 8 JS应用程序的CreateJS库有关。具体来说，我得到了：
preloadjs-NEXT.min.js has JavaScript syntax or other problems
easeljs-0.5.0.min.js has JavaScript syntax or other problems
和
easeljs-0.5.0.min.js is not properl
浏览 0提问于2012-12-23得票数 0
回答已采纳
我一直在寻找一种方法，让JavaScript动画(最好使用jQuery)表现得像一个旋转的3D立方体，类似于下面的脚本：
阻止我使用Keith的解决方案的是图像之间更平滑和更好的过渡的可能性。有没有可能只使用JS就能制作出更逼真的版本？
-Staffan
浏览 0提问于2010-10-12得票数 2
我有一个想法，但我不能应用它，因为我不是很熟悉Javascript。我的问题是我有一个JS脚本用于fadein和fadeout幻灯片，然而，在过渡期间有一个页面旋转似乎是很好的。我有一个CSS hover样式来做这个.card:hover .card__side--front {.card:hover: rotateY(-180deg)；}但是我不知道如何将它集成到JS脚本中。以下是幻灯片的JS脚本：
<script>
$("#slideshow > div:gt(0)").hide();
setInterval(function() {
$(&#
浏览 0提问于2019-05-29得票数 0
1回答
我目前正在用HTML和PhoneGap项目中的构建一个指南针应用程序，以获取指南针的方向。
我创建了。
我遇到的问题是，当值频繁变化(每200毫秒)时，CSS转换会结结巴巴。
通过进入上面链接的jsbin i并缓慢拖动滑块以增加或降低旋转度，您可以看到这个问题，特别是当您缓慢地拖动滑块时。
这让我相信，这不仅仅是一个性能或框架问题；它很可能是由中断转换的快速值更改引起的。
请注意在实际的PhoneGap应用程序中，指南针值每200毫秒(或其他一些任意间隔)刷新一次，而不是在jsbin模拟中看到的不一致的更新间隔。
我试着玩过渡时间一点，但都没有用。以下是我尝试过的：
尝试使过渡持续时间比值
浏览 6提问于2015-03-15得票数 4
回答已采纳
1回答
出于某种原因，我创建了一个自定义视图，覆盖了它的drawrect方法，以绘制一些字符串和img。就像这样：
@implementation WaterMarkView
- (void)drawRect:(CGRect)rect {
NSLog(@"drawRect");
NSString* test = @"This is a test string";
NSDictionary *dict = @{NSFontAttributeName:[UIFont systemFontOfSize:22],
浏览 34提问于2017-12-16得票数 0
1回答
我在我的应用中使用了WP7控件工具包的过渡动画。我的应用程序的页面都是浅蓝色的，但当使用过渡动画(比方说，旋转门)时，在动画过程中，会出现一个黑色背景。如何在过渡期间将此背景设置为浅蓝色？
浏览 1提问于2010-12-04得票数 3
回答已采纳
所以我有一个购物车，当它打开的时候，从右到左的转变大约是400px。
在购物车中，有一个由Slick.js制作的旋转木马商品的追加销售。
问题是，当转换发生时，有时项目会堆叠在一起。起初我认为问题出在Slick本身，但后来我发现是过渡导致了这个问题。
我在写这篇文章的时候发现了这一点，所以我不会有太多的代码在里面。
为了证明这一点，我只在转换结束后初始化Slick：
$('cartselector').on('transitionend", (event) => {
$('cartupsellselector').s
浏览 3提问于2020-12-11得票数 1
我想创建一个应用程序，在那里我可以旋转相机来查看特定的实体，但我的相机瞬间旋转，我如何才能使其平滑过渡 我尝试将动画组件附加到相机，但由于外观控制组件，旋转被覆盖 (click here)查看代码
浏览 17提问于2019-10-10得票数 1
回答已采纳
3回答
我想使用css3过渡来平滑使用phonegap的罗盘运动。我计算出所需的旋转角度从0到359。
问题是，当它应该从359度到0时，它不是顺时针旋转1度，而是逆时针旋转359度。
有没有办法告诉css总是以最短的方式旋转？
浏览 3提问于2013-10-27得票数 9
回答已采纳
4回答
我有一个div，我可以在一定程度上旋转它
rotateX(学位)
在css3中我设置
过渡: 2s
div将开始旋转并在2s内停止。这是我的问题:如果div正在旋转或停止，我如何获得？
谢谢。
浏览 10提问于2022-10-04得票数 0
回答已采纳
1回答
我需要一个过渡，不产生可怕的图像闪烁v-旋转木马-项目。理想情况下，这是一个平稳和快速的褪色，既适用于过渡，也适用于反向过渡。我已经尝试过所有内置到Vuetify的转换，以及几个定制的转换，但是都没有效果。我的问题可以在上看到，在上也有报道。
浏览 4提问于2020-06-11得票数 3
回答已采纳
1回答
我原以为这是一个很常见的问题，但实际上我没有找到任何答案。
我正在为移动制作一个网络应用程序/网站。当用户旋转他的手机，我想隐藏整个身体就在页面旋转，与丑陋的变形/过渡。然后，当这个过渡完成后，再次显示身体。
我已经做了一个最低版本的代码，在安卓上工作。在主体上有一个来自的背景图像，在html标记上有一个红色背景。预期的结果是:永远不要看到图像旋转。只有一个红色屏幕(也不旋转)
谢谢你的帮助。
ps:，我想我已经把问题缩小到了在之后在ios上的轮换和在__之前(如我所预期的那样)在android上被解雇的问题。
浏览 7提问于2014-08-26得票数 1
我已经让淡出转换在引导3构建中工作了一段时间，但我只是将调用从本地持有的bootstrap.min.css副本(Bootstrap v3.1.1)更改为<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.0/css/bootstrap.min.css" rel="stylesheet">，淡出转换不再起作用。直接翻到下一张幻灯片。根本没有过渡。
我试过添加旋转木马的id，但是没有用。
<div id="myCarousel" class="carousel
浏览 3提问于2014-11-06得票数 6
回答已采纳
如何用引导程序4显示正确的webpack 2 rc3配置？
这是我的
这是我的
在npm启动过程中，我得到了这个错误：
./~/extract-text-webpack-plugin/loader.js?{"omit":1，"remove":true}!./~/style-loader!./~/resolve-url-loader!./~/sass-loader?sourceMap!./~/bootstrap-loader/lib/bootstrap.styles.loader.js?{"bootstrapVersion":4，“extract
浏览 6提问于2017-01-11得票数 1
回答已采纳
我有一个过渡，填充一个循环进度栏。在某些情况下，我希望进度条也旋转，但我不希望它旋转，直到填充进度条部分完成。
我试过以下几种方法：
在转换delay中添加
这似乎推迟了整个过渡。
在定义自旋转换transition之前调用
这将执行两个转换，但在串行(第二个等待第一个完成)
在第一个元素发生时调用transition (我正在使用attrTween方法)
这将导致第一个转换立即停止，然后执行第二个转换。
示例(基于Ruben提供的示例)：
let svg = d3.select("svg"),
mar
浏览 1提问于2020-10-16得票数 2
回答已采纳
我在d3.js中有两个简单的物体，它们应该绕着视口的中心旋转(就像围绕太阳的行星)。
我是d3.js的新手，我知道我必须使用过渡，但由于行星必须一直绕圈，而不仅仅是在进场或退出时，我不知道在哪里以及如何设置过渡。
以下是我的当前代码：
var planets = [
{d:100,r:2},
{d:150,r:4}
];
var w = 500, h = 400, svg, circle;
function init(){
svg = d3.select("#drawArea").append("svg").attr({width:
浏览 4提问于2013-02-14得票数 8
回答已采纳
1回答
当改变iPad的方向时，我的应用程序旋转视图的速度非常快。很难察觉到两个方向之间的转变。我想增加一点这个过渡的持续时间。
有人知道如何延长这种过渡的持续时间吗？
谢谢!
浏览 3提问于2010-06-15得票数 1
回答已采纳
在中，我想出了如何修复在元素悬停时使用CSS3转换旋转元素所导致的抗锯齿问题。然而，修复已经改变了过渡。在修复之前，从开始到结束的过渡是平滑的。自修复以来，过渡变得非常严格。(值得注意的是，在使用Firefox时，过渡从来都不是一帆风顺的，但在抗锯齿修复之前，使用Safari或Chrome就是如此。)
以下是我最初使用的代码。如果您在Chrome或Safari中，请注意将鼠标悬停在框上时的过渡：
下面是反走样修复的代码：
有没有办法协调第二段代码，这样它既保留了抗锯齿修复，又提供了更干净的过渡？
浏览 0提问于2011-11-10得票数 0
这是我的css做动画。
变换:标度(0)rotateY(180)；
我必须为缩放和旋转提供单独的。但根据我的研究，我只能给出类似下面，它实际上提供了相同的放松功能，规模和旋转。
过渡:转换.7s轻松-外泄；
任何人都知道为比例和旋转提供单独的定时功能。
浏览 3提问于2013-02-07得票数 1
回答已采纳
1回答
我有一个div，我旋转360度与css过渡悬停风格。当鼠标退出时，动画停止，div返回到原来的样式。它是否有可能继续旋转直到它完成360度旋转，甚至鼠标是超出的div？我正在寻找一个纯粹的css解决方案，而不是jscript。
(谢谢你的帮助:)
浏览 3提问于2013-11-14得票数 2
回答已采纳
2回答
我想在我的应用程序中过渡，就像古老的史酷比卡通中的神秘旋转墙。我想让屏幕在切换视图时旋转。有没有人给我指个正确的方向，让我有可能做到这一点？
浏览 0提问于2012-05-06得票数 0
回答已采纳
当应用带有过渡动画的3D转换时，是否有一种方法可以从高deg旋转到较低的向前，这样我就可以通过向前移动20 deg而不是向后移动从350 deg旋转到10 deg。
浏览 0提问于2019-07-03得票数 0
回答已采纳
扫码
添加站长 进交流群
领取专属 10元无门槛券
手把手带您无忧上云
相关资讯
热门标签
云服务器
ICP备案
对象存储
腾讯会议
实时音视频活动推荐
腾讯云开发者
