jquery ui 插件------------------------->sortable
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>jQuery UI Sortable - Drop placeholder</title>
<link rel="stylesheet" href="https://code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css">
<script src="https://code.jquery.com/jquery-1.10.2.js"></script>
<script src="https://code.jquery.com/ui/1.11.4/jquery-ui.js"></script>
<link rel="stylesheet" href="/resources/demos/style.css">
<style>
#sortable { list-style-type: none; margin: 0; padding: 0; width: 60%; }
#sortable li { margin: 0 5px 5px 5px; padding: 5px; font-size: 1.2em; height: 1.5em; }
html>body #sortable li { height: 1.5em; line-height: 1.2em; }
.ui-state-highlight { height: 1.5em; line-height: 1.2em; }
</style>
<script>
$(function() {
$( "#sortable" ).sortable({
placeholder: "ui-state-highlight"
});
$( "#sortable" ).disableSelection();
});
</script>
</head>
<body>
<ul id="sortable">
<li class="ui-state-default">Item 1</li>
<li class="ui-state-default">Item 2</li>
<li class="ui-state-default">Item 3</li>
<li class="ui-state-default">Item 4</li>
<li class="ui-state-default">Item 5</li>
<li class="ui-state-default">Item 6</li>
<li class="ui-state-default">Item 7</li>
</ul>
</body>
</html>
详细参考网址:http://jqueryui.com/
jquery ui 插件------------------------->sortable的更多相关文章
- jQuery学习笔记(jquery.ui插件)
官网地址:http://ui.jquery.com/ jQuery UI源自于一jQuery插件-Interface.目前版本是1.10.3,需要jQuery 1.6以上版本支持. jQuery UI ...
- jQuery UI Draggable + Sortable 结合使用
工作中需要将一个左边的设计好的控件,拖拽到右边的面板中,同时保持右边面板中的控件自由排序,这时候就需要及支持拖拽又支持排序的操作了, Demo截图:从左边控件拖到右边区域 代码段: <scrip ...
- 在Eclipse ee中成功使用jQuery UI插件
关键代码截图如下:
- 三、jQuery--jQuery基础--jQuery基础课程--第10章 jQuery UI型插件
1.拖曳插件——draggable 拖曳插件draggable的功能是拖动被绑定的元素,当这个jQuery UI插件与元素绑定后,可以通过调用draggable()方法,实现各种拖曳元素的效果,调用格 ...
- jQuery基础(常用插件 表单验证,图片放大镜,自定义对象级,jQuery UI,面板折叠)
1.表单验证插件——validate 该插件自带包含必填.数字.URL在内容的验证规则,即时显示异常信息,此外,还允许自定义验证规则,插件调用方法如下: $(form).validate({o ...
- 使用 jQuery UI Widget Factory 编写有状态的插件(Stateful Plugins)
使用 jQuery UI Widget Factory 编写有状态的插件(Stateful Plugins) Note 这一章节的内容是基于 Scott Gonzalez 一篇博客 Building ...
- jquery UI 跟随学习笔记——拖拽(Draggable)
引言 这周暂时没有任务下达,所以老大给我的任务就是熟悉jquery相关插件,我就先选择了jquery UI插件,以及jquery库学习. 我用了两天的时候熟悉Interactions模块中的Dragg ...
- jQuery常用插件
jQuery UI插件简介: jQuery UI是以 jQuery 为基础的开源 JavaScript 网页用户界面代码库.包含底层用户交互.动画.特效和可更换主题的可视控件.我们可以直接用它来构建具 ...
- 使用Jquery UI 高仿百度搜索下拉列表功能
最近项目有个需求,在新添加商户的时候,用户输入商户名称后,如果系统中有类似的商户名称,直接显示出来,如下图的效果: 实现这个功能,直接使用了JQuery UI 插件 目前我使用的实现版本是: 网友可以 ...
随机推荐
- Werkzeug教程
http://chaoxz2005.blog.163.com/blog/static/15036542012863405266/ http://www.dajo.com.cn/a/boke/pytho ...
- Java语言基础(一) 标识符
Java标识符的问题: ①不可以以数字开头 int 123number = 0; //错误 ②可以使用任意的货币符号(¥和$等等)中文也可以 int $i = 0; //正确 int ¥i = 1; ...
- c++类型转换Type Cast)
C风格的强制类型转换(Type Cast)很简单,不管什么类型的转换统统是:TYPE b = (TYPE)a.C++风格的类型转换提供了4种类型转换操作符来应对不同场合的应用. const_cast, ...
- 【转】MFC下拉列表框的用法
原文网址:http://blog.csdn.net/kinglimy/article/details/6452239 Combo Box (组合框)控件很简单,可以节省空间.从用户角度来看,这个控件是 ...
- Camus导入中文乱码问题(源码修改、编译、部署、任务启动)
Camus使用过程中业务方反映从Kafka导入至HDFS中的数据有中文乱码问题,且业务方确认写入的数据编码为UTF-8,开始跟进. 问题重现: (1)编写代码将带有中文的字符串以编码UTF-8 ...
- maya绝招(60---尾)
第64招 置换新意 Displacement(置换)和Bump(凹凸)效果类似,但运行方式不同.将一个File结点用中间拖动到材质上有的shading Group属性中的置换属性上,这个时候可以看到o ...
- HDOJ 2010 水仙花数
Problem Description 春天是鲜花的季节,水仙花就是其中最迷人的代表,数学上有个水仙花数,他是这样定义的: "水仙花数"是指一个三位数,它的各位数字的立方和等于其本 ...
- java 泛型学习
http://blog.csdn.net/archie2010/article/details/6232228 学习集合框架的时候经常用hasmap<Integer,Integer>就是泛 ...
- Hdu 5036-Explosion 传递闭包,bitset,期望/概率
题目:http://acm.hdu.edu.cn/showproblem.php?pid=5036 Explosion Time Limit: 6000/3000 MS (Java/Others) ...
- rfc的资料
所有rfc的集结地: http://www.rfc-editor.org/rfc rtp的rfc: http://en.wikipedia.org/wiki/RTP_audio_video_pr ...