问题标签 [transitions]

For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.

0 投票
3 回答
289 浏览

javascript - 在jquery中重做flash网站?可行的?

我正在考虑尝试重新设计一个带有 jquery 效果和过渡的 Flash 网站。我只是想联系社区,看看考虑到这个网站的特定过渡和影响,这真的是多么可行。

这是链接:

http://antonynicoli.com/english.html

我猜这个画廊可以通过轮播插件重新创建,但是那里有这么多,所以也许可以建议一个最适合这项工作的稳定画廊。其他真正引起我注意但我真的不知道从哪里开始的项目是导航栏以及当您单击导航栏上的链接时看起来像一本书打开的效果。任何和所有输入将不胜感激。谢谢。

0 投票
3 回答
974 浏览

css - CSS3 过渡 - Javascript 库

有人知道一个小的 Javascript 库,它可以模拟 Firefox 3.6 或 IE8 等浏览器的 CSS3 转换吗?

例子:

我想这样的库很难开发。

这两个支持很多但不支持 CSS3 过渡:

然后我们有Modernizr,但它只进行功能测试。

拥有一个额外的用于 CSS3 过渡支持的迷你库的好处是您不需要编写自己的备份代码。您可以将其插入并确保这些转换在大多数浏览器中都有效。

0 投票
1 回答
7919 浏览

wpf - VisualStateManager 和生成的转换

就在我认为我理解的时候VisualStateManager,有些事情证明我错了。

我正在使用 WPF 4,并试图在鼠标悬停时简单地放大项目,并在鼠标离开时将其缩小。我想我只需在 a 中定义每个状态,VisualStateGroup然后VisualTransition用 a 指定 a GeneratedDuration

由于我有一个包罗万象的VisualTransitiona GeneratedDuration,我期待 VSM 生成中间动画。也就是说,将鼠标悬停在控件上应该ScaleTransform会在 1 秒内将属性从 1 设置为 1.5。与鼠标关闭相同。相反,有 1 秒的延迟,然后ScaleTransform属性立即捕捉到 1.5 或回到 1。

如果我手动指定转换如下,那么我会得到所需的行为:

但为什么我必须这样做?我认为生成转换的全部意义在于,转换将是,你知道的,生成的。我在这里有什么误解?

更新:根据 Rick 的回答,Blend 生成的东西确实有效。因此,向后工作,我确定这确实是我ScaleTransform直接引用而不是通过UIElement包含它的事实。我将我的 XAML 更改为以下内容,它按预期工作:

看起来很荒谬(也是一个明显的错误),但它确实有效。

谢谢

0 投票
1 回答
683 浏览

c# - 如何在 Silverlight 4 中从 WebBrowser 控件平滑过渡到图像?


我的页面上有以下 XAML:

然后在代码隐藏中,我在图像和浏览器内容之间切换可见性:

这很好用,但是客户端现在想要的是在显示图像和显示浏览器之间的平滑过渡。我尝试了几种方法,但总是陷入死胡同。你有什么想法?

我尝试使用 VSM 设置两个状态,而不是在交换发生之前在顶部显示一个白色矩形作为覆盖,但这不起作用(我猜是因为没有任何东西可以放在 WebBrowser 上方?)我尝试设置使用 VSM 的图像控件和 webbrowser 控件的可见性,但这也不起作用。我真的不知道还有什么可以尝试解决这个简单的任务。

任何帮助是极大的赞赏。

0 投票
2 回答
1931 浏览

apache-flex - 我应该如何在 flex/flashbuilder 中平滑这两种状态之间的过渡

我有一个项目,其中有两种状态,最好描述为打开和关闭,它们看起来像这样:

关闭

打开

我想做的是平滑一种状态和另一种状态之间的过渡,有效地通过以平滑方式(正弦)在两点之间进行插值来移动页脚/按钮块,然后在饼图中淡入淡出。

然而,这显然超出了我的范围,在我挣扎了一个小时后我无法这样做+我把它贴在这里:D

所以我的过渡块如下所示

其中{body}指的是饼图,{footer}指的是页脚/按钮块。

但是这不起作用,所以我真的不知道该怎么办......

可能有益的其他信息:

主体块始终具有固定高度(可能在某些效果中用于 Xby 变量?)。

它需要双向工作。

哦,该Sine块在上面的声明中定义为<s:Sine id="Sine">.

此外!我将如何设置饼图以使用这些转换块连续旋转?(这会在没有标签的情况下发生)或者这是错误的方法,因为它不是这样的过渡?

我所追求的效果是饼图在选择下面的按钮之前在没有标签的情况下缓慢旋转,但在选择时旋转停止并出现标签......

提前非常感谢!

并在灰度上道歉,但我真的无法决定配色方案。欢迎任何建议。

0 投票
4 回答
5049 浏览

wpf - VisualStateManager 没有像宣传的那样工作

以下问题已经困扰我好几天了,但我只能将其提炼成最简单的形式。考虑以下 XAML:

它只是重新模板化CheckBox控件,使其背景取决于其状态:

  • 选中 = 绿色
  • 未选中 = 红色
  • 检查(过渡)=浅绿色
  • 取消选中(过渡)= 浅红色

因此,当您选中其中一个复选框时,您会希望它在短时间内变为浅绿色,然后变为绿色。同样,取消选中时,您希望它会在短时间内变为浅红色,然后变为红色。

它通常就是这样做的。但不总是。

玩这个程序足够长的时间(我可以在大约 30 秒内得到它),你会发现过渡动画有时在视觉状态下胜过它。也就是说,复选框在选中时将继续显示为浅绿色,在未选中时将继续显示为浅红色。这是一个屏幕截图,说明了我的意思,在转换配置为 3 秒后拍摄:

在此处输入图像描述

发生这种情况时,并不是因为控件没有成功转换到目标状态。它声称处于正确的状态。我通过在调试器中检查以下内容来验证这一点(对于上面屏幕截图记录的特定情况):

如果我启用动画跟踪,当转换成功完成时,我会得到以下输出:

当转换未能成功完成时,我得到以下输出:

前 12 行与转换成功时完全相同,但最后 10 行完全缺失!

我已经阅读了我能找到的所有 VSM 文档,但无法对这种不稳定的行为做出解释。

我是否可以假设这是 VSM 中的错误?此问题是否有任何已知的解释或解决方法?

0 投票
1 回答
639 浏览

jquery - jQuery Cycle 的 IE 问题:过渡期间图片略有位移

我的问题比解释更容易看到:

你可以看到,在过渡过程中,图片有一个小的移动,看起来很糟糕。在 Firefox 中,这不会发生。

这是 HTML 代码(有一些用于 CakePHP 的 php,它使用指定的参数写入,但即使使用常规 HTML,问题仍然存在):

-- 在阅读代码之前,为了节省您一些时间,您可能想阅读下面我对导致此问题的原因的解释-

这是CSS:

因此,在尝试修改 CSS、添加新 div、删除 div 和许多其他操作之后,我发现如果我从代码中删除除一行之外的所有行,那么问题就消失了。例如,如果我只有一行和一行,取决于“home_title”div的高度,问题出现或消失。例如,如果我添加一个 20px 的 padding-top 和一个 padding-bottom,一切都很好,没有过渡问题。但是如果我添加 30px 而不是 20px,问题就在那里。

那么,上面 div 的高度怎么可能改变过渡的行为呢?我尝试在中间添加一个空 div,但没有解决问题。这就像问题来自从sildeshow到顶部的距离。另外,如果我在“home_slideshow”中使用“position:absolute”手动定位它,那么问题也消失了。但是我的布局失去了灵活性,我稍后会需要。

关于这里会发生什么的任何想法?非常感谢您!

0 投票
2 回答
185 浏览

php - 如何找到两个列表之间的变化,带有不可移动的项目(PHP)

我正在尝试获取两个文章列表之间的更改,以便为两个列表之间的过渡设置动画。文章可以添加、删除或移动(不交换)。

但是有些文章不能移动,并且在每次转换中,所有其他文章都应该移到这些文章下面。

例如,如果每个数字代表一个文章id,粗体代表不可移动的文章,那么:[1, 2 , 3, 4 , 5, 6] 可能变成: [ 2 , 4 , 1, 6, 7]

我需要制定所需的更改,例如在这种情况下:

  • 在 4 后移动 1
  • 删除 5
  • 6后加7

我一直在使用 diff 算法,但是它不理解不可移动的项目,所以它可能建议:

  • 将 2 移到开头
  • 2 后移动 4
  • 删除 5
  • 6后加7

我尝试了各种方法,但无法使其可靠地工作。

0 投票
1 回答
1396 浏览

ruby-on-rails - rails 状态机转换和保护/验证

我似乎无法弄清楚如何使验证与状态机一起正常工作。IE 我想在允许新的发布状态之前进行某些验证:

Transitions,我正在使用的 gem 有一个保护方法,但我似乎无法弄清楚如何正确使用它进行多个验证。

尝试简单地应用基本验证,如下所示:

https://github.com/qoobaa/transitions

更新:这似乎像我想要的那样工作,但我的下一个问题是如何将所有验证集中在一起以简化我的方法?我觉得我让它变得比它可能的复杂得多,而且也不那么健壮。有任何想法吗?

0 投票
2 回答
1196 浏览

jquery-mobile - Jquery 移动过渡

第一次使用jquery移动版。

为什么这不起作用?

我想 onClick 让内容淡入,但它没有发生,它只是看起来很粗糙而且一点也不平滑。

谢谢

普鲁达