jQuery UI.Layout Plug

jQuery UI.Layout Plug-in

jQuery还是蛮夯的家伙。 CSS+DIV时代，要编排个页框的版面还真不简单，如果又是对为对于网页的layout不是很在行的人，非常适合这套jQuery UI.Layout Plug-in。

这个plugin的功能真的还蛮强大的，我觉得其中比较特殊的是下面这几点：

collapsable：每一个pane都可以收合，而且还可以加上jQuery特效
resizable：每一个pane都可以缩放，而且还可以限制缩放的大小
hotkeys：每一个pane都可以用键盘的方向键来操作，甚至自订快速键(这个最酷！)

大家可以直接点选一下上面的iframe，然后压着ctrl再按方向键，你就会知道这个自订快速键是什么意思啰。非常推荐这个plugin，简直是拯救了我们这种对layout完全不在行的工程师呀！ ！ ！有更多进阶范例可以直接到demo页面看看喔。

时间： 2024-08-04 05:06:19

jQuery UI.Layout Plug的相关文章

jQuery布局插件UI Layout简介及使用方法_jquery

UI Layout是一种基于jQuery的布局框架,项目主页http://layout.jquery-dev.net/.该框架的参考原型是ExtJS的border-layout,因此十分适用于将原有使用ExtJS的项目改造成jQuery项目.其核心是一个大小自适应的中心面板(必选),面板的上下左右四个方向可以放置可折叠.可缩放的面板(可选),各个面板可以添加任意数量的页眉和页脚面板.UI Layout支持内层布局的嵌套,任意块元素都可以当作布局的容器,最基本的布局容器是body. 基本使用方法:

jQuery UI Portlet V1.1.0 发布

前言 继11.22日发布了第一版jQuery UI Portlet之后得到了一些网友的反馈,今天把酝酿了几天的想法全部加入到了新版本中. 1. 新特性 添加单视图模式,双击标题栏可以进行切换,并且有动画效果 添加内容高度设置,可以为每个portlet设置高度 添加压缩版本的js文件 demo页面大调整,用:左上右的layout布局,方便演示 同步API 2. 新版截图 项目主页(Demo):http://www.kafeitu.me/demo/jquery-ui-portlet/index.ht

推荐10款最热门jQuery UI框架[原创]_jquery

1.国产jQuery UI框架 (jUI) DWZ DWZ富客户端框架(jQuery RIA framework), 是中国人自己开发的基于jQuery实现的Ajax RIA开源框架. 设计目标是简单实用,快速开发,降低ajax开发成本. 欢迎大家提出建议,我们将在下一版本中进一步调整和完善功能．共同推进国内整体ajax开发水平. 在线演示地址:http://j-ui.com http://runjs.cn/detail/x9c7d6qb 2.jQuery的界面插件 Ninja UI jQuer

Dreamweaver扩展:Web开发jQuery UI接口框架

绝大多数的Web设计师和Web开发者可能都会经常使用Adobe的产品来完成工作,本文整理了5个在Web设计开发中最常用jQuery UI 接口框架,帮助你提高项目开发效率.这些jQuery UI 框架操作非常简单,即使你是初学者. 安装这些Dreamweaver扩展前,你需要检查你的Dreamweaver和Extension Manager版本是否为当前最新版本: Dreamweaver CS4 and Extension Manager CS4. 1. jQuery UI Calendar j

使用jquery ui的datepicker开发课程日历

这两天在开发某商学院的网站,里面有涉及到课程的模块,客户希望在网站的首页显示一个日历, 在有课程的日期加上显眼的标识,使网站用户一眼看到日历后就能知道哪天商学院有课程以便他们安 排时间报名修读. 这个功能挺有意思的,符合本人及非常小器公司一直所坚持的"为客户创造价值"的理 念,它真正从用户的角度思考问题了,客户真正需要的.实用的东西是我最喜欢开发的产品因为我觉 得不能为客户创造价值的产品最终必定不能为自己创造价值,这个世界是讲因果的. 刚开始的时候感觉用第三方的东西挺麻烦的,一来要研究

如何使用jQuery UI主题

主题并不是一个新概念.当您使用级联样式表 (CSS) 样式与类设计网站的外观时,很可能已经使用了一些 主题.使用框架标准化设计方法,可以减少工作量和需要编写的代码量. jQuery UI 现在已经成为主 题实现的行业标准.虽然还存在其他的选择,比如 Dojo(与 Dijit 耦合在一起)或 Ext JS,但 jQuery UI 将主题与小部件的使用结合在一起,小部件是用户与日期选择器或按钮进行交互时需要使用的元素.构成 jQuery UI 主题的文件的内部工作原理就是 CSS 与 JavaScr

jQuery入门(21) jQuery UI示例

上篇介绍了使用jQuery UI基本工作过程,后面就逐个介绍jQuery UI库内置的UI组件,支持的拖放 ,动画效果等,如果你之前看过Yii Framework教程 ,PHP Yii Framework封装了jQuery UI组件,有兴 趣的可以看一看. 本教程面的示例基本翻译自jQuery UI 英 文网站,部分例子可能有些修改,测试环境依然是Visual Studio IDE (2012). jQuery UI  也支持多种显示主题.

jQuery入门(20) jQuery UI基本工作过程

本篇介绍JQuery UI组件的基本工作过程,以进程条(Progressbar)为例介绍JQuery UI组件工作的 基本过程. 初始化 大部分JQuery Ui组件都可以保持其状态,因此为了能够跟踪UI组件的状 态,jQuery UI组件也有一个生命周期,这个生命周期从初始化开始,为了初始化一个UI组件,一般在 某个HTML元素调用UI组件(插件)方法.,比如 $( "#elem" ).progressbar(); 这 个方法初始化id=elem的元素,因为我们调用progressb

jQuery入门(19) jQuery UI概述

前面介绍了jQuery的基本用法,jQuery UI 是一套 JavaScript 函式库,提供抽象化.可自订主题 的 GUI 控制项与动画效果.基于 jQuery JavaScript 函式库,可用来建构互动式的Web应用. 它的基本功能有: 互动 拖曳(Draggable) – 让元素可以用滑鼠拖曳. 拖放 (Droppable) – 让控制项可以接受其他拖曳进来的元素. 调整大小(Resizable) – 让元素可 以调整大小. 选取(Selectable) – 提供进阶的大量元素选择功能