欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页

不得不爱开源 Wijmo jQuery 插件集(3)-【菜单】(附页面展示和源码)

程序员文章站 2022-03-19 08:49:15
...

经过前两篇文章的介绍我们了解了 开源Wijmo jQuery 插件集 所包含的 插件 和 多种Theme 样式。还为刚入门的朋友提供了 jQuery 入门的一些基础知识。

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

 

同时也再次感谢园子中朋友的支持,从这篇文章起,我们就分别介绍 开源Wijmo jQuery 插件集 中的插件。这篇文章我们将介绍 Wijmo Menu 使用方法。

看看 Wijmo Menu 给我们提供了哪些功能?

可以创建多级的、动态效果的、滚动的菜单,同时我们可以在菜单中添加图片、复选框按钮。下面我们就来展示下我们不得不爱的 Wijmo Menu,甚至还可以创建一个弹出式 Menu。

功能预览展示:(sry,很遗憾依然无法插入iframe)

http://www.gcpowertools.com.cn/liveSamples/C1WijmoOpen/ControlExplorer/wijmo-open/development-bundle/samples/menu/overview.html

建立你的第一个 Wijmo jQuery Menu:

<ul id="menu">
    <li><a>menuitem1</a>
        <ul>
           <li><a>menuitem1a</a></li>
           <li><a>menuitem2a</a></li>
        </ul>
    </li>
    <li><a>menuitem2</a></li>
    <li><a>menuitem3</a></li>
</ul>
 
<script type="text/javascript">
$(document).ready(function () {
$("#menu").wijmenu();
});
</script>
 

效果预览:

http://www.gcpowertools.com.cn/liveSamples/C1WijmoOpen/ControlExplorer/wijmo-open/development-bundle/samples/menu/basic.htm

特性

垂直和水平菜单

菜单和子菜单,包括其他的布局选项,都可以水平或垂直地呈现出来。

效果截图:

 不得不爱开源 Wijmo jQuery 插件集(3)-【菜单】(附页面展示和源码)
            
    
    博客分类: 报表控件 jqueryJavaScriptui开源 

滚动显示

C1Menu可以滚动显示顶层菜单,子菜单和子组。你可以将滚动模式选项设置为,按钮点击滚动、按钮悬停滚动、边缘徘徊滚动或滚动条。

 效果截图:

不得不爱开源 Wijmo jQuery 插件集(3)-【菜单】(附页面展示和源码)
            
    
    博客分类: 报表控件 jqueryJavaScriptui开源 

菜单项目图标

菜单项可以有它们自己的图标。你可以从许多内置的图标中选择,也可以添加你自己的图标到菜单。

 不得不爱开源 Wijmo jQuery 插件集(3)-【菜单】(附页面展示和源码)
            
    
    博客分类: 报表控件 jqueryJavaScriptui开源 

动画

菜单支持不同的展开和折叠的动画效果。例如,渐变、从顶部滚动、水平打开、反弹,等等。

主题

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

不得不爱开源 Wijmo jQuery 插件集(3)-【菜单】(附页面展示和源码)
            
    
    博客分类: 报表控件 jqueryJavaScriptui开源 

源码下载(包含以上特性):wijmo-menu.zip

 

好了,关于 wijmo-menu 部分我们就介绍到这里,感兴趣的朋友可以下载源码动手尝试。在下一篇文章中我们将介绍 Wijmo  Accordinon 的特性及使用方法。

 

 

葡萄城控件

wijmo中文官方网站