<!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的更多相关文章

  1. jQuery学习笔记（jquery.ui插件）

    官网地址:http://ui.jquery.com/ jQuery UI源自于一jQuery插件-Interface.目前版本是1.10.3,需要jQuery 1.6以上版本支持. jQuery UI ...

  2. jQuery UI Draggable + Sortable 结合使用

    工作中需要将一个左边的设计好的控件,拖拽到右边的面板中,同时保持右边面板中的控件自由排序,这时候就需要及支持拖拽又支持排序的操作了, Demo截图:从左边控件拖到右边区域 代码段: <scrip ...

  3. 在Eclipse ee中成功使用jQuery UI插件

    关键代码截图如下:

  4. 三、jQuery--jQuery基础--jQuery基础课程--第10章 jQuery UI型插件

    1.拖曳插件——draggable 拖曳插件draggable的功能是拖动被绑定的元素,当这个jQuery UI插件与元素绑定后,可以通过调用draggable()方法,实现各种拖曳元素的效果,调用格 ...

  5. jQuery基础（常用插件 表单验证，图片放大镜，自定义对象级，jQuery UI，面板折叠）

    1.表单验证插件——validate   该插件自带包含必填.数字.URL在内容的验证规则,即时显示异常信息,此外,还允许自定义验证规则,插件调用方法如下:   $(form).validate({o ...

  6. 使用 jQuery UI Widget Factory 编写有状态的插件（Stateful Plugins）

    使用 jQuery UI Widget Factory 编写有状态的插件(Stateful Plugins) Note 这一章节的内容是基于 Scott Gonzalez 一篇博客 Building ...

  7. jquery UI 跟随学习笔记——拖拽（Draggable）

    引言 这周暂时没有任务下达,所以老大给我的任务就是熟悉jquery相关插件,我就先选择了jquery UI插件,以及jquery库学习. 我用了两天的时候熟悉Interactions模块中的Dragg ...

  8. jQuery常用插件

    jQuery UI插件简介: jQuery UI是以 jQuery 为基础的开源 JavaScript 网页用户界面代码库.包含底层用户交互.动画.特效和可更换主题的可视控件.我们可以直接用它来构建具 ...

  9. 使用Jquery UI 高仿百度搜索下拉列表功能

    最近项目有个需求,在新添加商户的时候,用户输入商户名称后,如果系统中有类似的商户名称,直接显示出来,如下图的效果: 实现这个功能,直接使用了JQuery UI 插件 目前我使用的实现版本是: 网友可以 ...

随机推荐

  1. Redis监控

    首先判断客户端和服务器连接是否正常 # 客户端和服务器连接正常,返回PONG redis> PING PONG # 客户端和服务器连接不正常(网络不正常或服务器未能正常运行),返回连接异常 re ...

  2. bzoj3437

    练一下斜率优化 ..] of int64; q,a,b:..] of longint; i,n,h,t,j:longint; function g(j,k:longint):double; var a ...

  3. HDOJ(HDU) 2523 SORT AGAIN(推导排序、、)

    Problem Description 给你N个整数,x1,x2-xn,任取两个整数组合得到|xi-xj|,(0 < i,j<=N,i!=j). 现在请你计算第K大的组合数是哪个(一个组合 ...

  4. hdu 4091 Zombie’s Treasure Chest(数学规律+枚举)

    题目链接:http://acm.hdu.edu.cn/showproblem.php?pid=4091 /** 这题的一种思路就是枚举了: 基于这样一个事实:求出lcm = lcm(s1,s2), n ...

  5. linux下swftools 的配置

    1.安装所需的库和组件.机器之前安装过了,主要安装的是下面几个组件.如果不安装会提示machine `x86_64-unknown-linux' not recognized yum install ...

  6. 公司框架将入参Map化

    1.Map<String,Object> map = BeanUtil.describe(inDto);

  7. 子元素margin-top属性传递给父元素的问题 转！

    问题描述:一个父包含框包含一个子元素.给正常流的子元素一个垂直外边距margin-top就会使得父元素跟着往下走,而子元素和父元素的边距则没有发生变化. html结构:<div class=&q ...

  8. sql 数据字段类型

    bit    整型 bit数据类型是整型,其值只能是0.1或空值.这种数据类型用于存储只有两种可能值的数据,如Yes 或No.True 或False .On 或Off. 注意:很省空间的一种数据类型, ...

  9. return的用处

    #include "stdio.h" main() { ,c=; ;a<;a++) { c=c+a; } printf("%d",c); return ; ...

  10. intelij idea

    tip of day关闭后可以在左上角的help中找到