Accordion - 动画

动画

示例

缓和的动画

第一

ComponentOne 使用强大的客户端核心技术--Wijmo，为从WebForms到MVC应用程序开发提供最终的UI控件。使用Wijmo这一项技术您就可以完成客户端到服务端的所有开发工作， Studio for ASP.NET Wijmo控件包是您团队在进行Web应用程序开发时一件不可多得的利器。

第二

使用集 HTML5、jQuery、CSS3、和 SVG 多项技术于一体的 Studio for ASP.NET Wijmo 控件包进行开发，可以让您的 Web 应用系统紧跟当前的流行趋势，并能让您的 Web 应用程序拥有更快的执行速度、用户访问也更加流畅。

第三

您可以非常便捷地为您的整个系统定义统一的显示外观。您可以使用 Studio for ASP.NET Wijmo 控件包内置的6个主题，同时您还可以使用 jQuery UI项目提供的 30 多个主题，甚至可以使用 ThemeRoller 创建属于您自己的系统主题。

不使用动画

第一

ComponentOne 使用强大的客户端核心技术--Wijmo，为从WebForms 到MVC应用程序开发提供最终的UI控件。使用Wijmo这一项技术您就可以完成客户端到服务端的所有开发工作， Studio for ASP.NET Wijmo控件包是您团队在进行Web应用程序开发时一件不可多得的利器。

第二

第三

您可以非常便捷地为您的整个系统定义统一的显示外观。您可以使用 Studio for ASP.NET Wijmo 控件包内置的6个主题，同时您还可以使用 jQuery UI 项目提供的 30 多个主题，甚至可以使用 ThemeRoller 创建属于您自己的系统主题。

自定义动画

第一

ComponentOne 使用强大的客户端核心技术--Wijmo，为从WebForms到MVC应用程序开发提供最终的UI控件。使用Wijmo这一项技术您就可以完成客户端到服务端的所有开发工作，Studio for ASP.NET Wijmo 控件包是您团队在进行Web应用程序开发时一件不可多得的利器。

第二

第三

您可以非常便捷地为您的整个系统定义统一的显示外观。您可以使用 Studio for ASP.NET Wijmo 控件包内置的6个主题，同时您还可以使用 jQuery UI 项目提供的 30 多个主题，甚至可以使用 ThemeRoller 创建属于您自己的系统主题。

描述

此示例演示了如何使用C1Accordion 控件展现各种动画效果。

Animated Animated 属性用于改变动画效果。

在第一个accordion中，Animated.Effect 属性设置为 "easeInOutCirc" ，展示出来的是缓和的变换效果。

在第二个accordion中，设置的是无动画效果，变换不带有动画效果。

在第三个accordion中，我们使用的是自定义动画效果 Animated.Effect 属性设置为 "custom1"。"custom1" 效果使用客户端脚本有如下定义：

	$(document).ready(function () {
		jQuery.wijmo.wijaccordion.animations.custom1 = function (options) {
			this.slide(options, {
				easing: options.down ? "easeOutBounce" : "swing",
				duration: options.down ? 1000 : 200
			});
		}
	});

可用的动画功能选项包括：

向下 – 值为True时，表示展开的窗口应大于折叠窗口。
横向– 值为True时，表示accordion 有一个水平方向 (拓展方向为左侧或右测)。
从右至左 – 值为True时，表示内容先于标题显示 (拓展方向为顶部或左侧)。
显示 – 显示jQuery对象包含的元素内容。
隐藏 – 隐藏jQuery对象包含的元素内容。

文档