不得不爱开源 Wijmo jQuery 插件集(4)-【手风琴效果】

有些朋友第一次看到本系列文章,所以给出本系列文章的链接:

首先让我们看看 Wijmo Accordion 给我们带来了哪些惊喜?

它可以提供多个窗格的内容,并且可以用ComponentOne为ASP.NET Wijmo出品的Accordion™控件在同一时间显示他们。C1Accordion控件支持数据绑定,具备四个扩展方向,含有超过三十个可能的动画,并且具备完全自定义的标题和内容区域的能力。

建立你的第一个 Wijmo jQuery Accordion:

HTML 标签:

<div id="accordion">

<h3>手风琴样式</h3>

<div>内容</div>

<h3>手风琴样式</h3>

<div>内容</div>

<h3>手风琴样式</h3>

<div>内容</div>


</div>



jQuery 脚本:
<script type="text/javascript">

$(document).ready(function () {
$("#accordion").wijaccordion();
});

</script>
 

特性

多个窗格

为了在一个窗格中一次显示你的全部信息,可以添加多个窗格和风琴褶。

不得不爱开源 Wijmo jQuery 插件集(4)-【手风琴效果】

 

外部内容

你可以在风琴褶窗格或可视区域显示外部的内容,包括你的项目中另一个网页的内容,或者甚至是你的项目之外的网站的内容。

四个扩展方向

风琴褶控件能够在几个不同的方向上扩展:上方,右侧,底部,左侧。

不得不爱开源 Wijmo jQuery 插件集(4)-【手风琴效果】

动画

风琴褶含有内置的动画选项。它可以自定义如何将动画效果转换为风琴褶。

键盘支持

通过添加键盘的辅助功能支持,用指定的组合键来给C1Accordion控件一个重点。这使最终用户可以使用键盘上的箭头键来浏览C1AccordionPanes。

主题

只需点击一下智能标签SmartTag,就可以通过从六个溢价主题(北极,午夜时分,雅集,火箭,钴和英镑)中选择一个来改变风琴褶控件的外观。另外,还可以使用jQuery UI中的ThemeRoller来创建一个自定义的主题!

不得不爱开源 Wijmo jQuery 插件集(4)-【手风琴效果】

 

CSS支持

你可以使用这一种级联样式表(CSS)的样式来定义自定义皮肤。有了CSS支持,你可以使风琴褶与你的组织标准相匹配。

感谢大家阅读本文章,在下一篇文章中我们将介绍 Wijmo jQuery Dialog-对话框 的使用方法。

最后,和大家分享一些资源吧:

1.源码下载(包含以上特性):Wijmo-Accordion.zip 

2.更多信息请参考:Wijmo 中文网站:http://www.gcpowertools.com.cn/products/c1_asp_overview.htm

3.开源Wijmo jQuery 讨论社区: http://gcdn.grapecity.com/index.aspx

相关推荐