先下载:http://code.jquery.com/ui/1.10.3/jquery-ui.js

$('.i-i-yuan').draggable({
containment: '#app'//可通过设置拖动范围的div的id来限制拖动空间的移动范围
});
.i-i-yuan{
position: fixed;
cursor: pointer;
right: 50px;
bottom: 50px;
width: 80px;
height: 80px;
display: flex;
justify-content: center;
align-items: center;
font-size: 50px;
color: #B60000;
border-radius: 50%;
box-shadow: 0 5px 10px rgba(0, 0, 0, .5);
background: -webkit-linear-gradient(#ffc000, #c59e29); /* Safari 5.1 - 6.0 */
background: -o-linear-gradient(#ffc000, #c59e29); /* Opera 11.1 - 12.0 */
background: -moz-linear-gradient(#ffc000, #c59e29); /* Firefox 3.6 - 15 */
background: linear-gradient(#ffc000, #c59e29); /* 标准的语法 */
}

web可拖动控件js的更多相关文章

  1. “此网页上的某个 Web 部件或 Web 表单控件无法显示或导入。找不到该类型,或该类型未注册为安全类型。”

    自从vs装了Resharper,看见提示总是手贱的想去改掉它.于是乎手一抖,把一个 可视web部件的命名空间给改了. 喏,从LibrarySharePoint.WebPart.LibraryAddEd ...

  2. WEB进度条控件

    近段时间为了工作的需要学习了一下写自定义控件,呵呵!以前没写过,近段时间才开始研究的,昨天写了一个WEB状态条控件,可以设置进度条的百分比,也可以设置它的总数与当前的数量来自动计算百分比,可以设置颜色 ...

  3. Atitit..组件化事件化的编程模型--(2)---------Web datagridview 服务器端控件的实现原理and总结

    Atitit..组件化事件化的编程模型--(2)---------Web datagridview 服务器端控件的实现原理and总结 1. 服务端table控件的几个流程周期 1 1.1. 确认要显示 ...

  4. wxpython 中 用鼠标拖动控件 总结

    #encoding: utf-8 import wx import os import noname class Frame( noname.MyFrame1 ): def __init__(self ...

  5. win10 uwp 拖动控件

    我们会使用控件拖动,可以让我们做出好看的动画,那么我们如何移动控件,我将会告诉大家多个方法.其中第一个是最差的,最后的才是我希望大神你去用. Margin 移动 我们可以使用Margin移动,但这是w ...

  6. 选择控件js插件和使用方法

    记录一下 选择控件js插件 /* * 滚动控件,包含地址选择.时间选择.自定义单选 */ //js_inputbox input 输入框 //js_pickviewselect 下拉单项选择 //js ...

  7. 【WEB自动化测试之控件定位】基于HTML5控件的唯一控件属性定位

      一.WEB控件定位是什么 要想弄懂这个问题,我们还是基于实践来学习.我们先来看一条入门级别自动化测试用例的构成. DemoCase:正确用户名和密码登录博客园,登录成功 URL: https:// ...

  8. web前端开发控件学习笔记之jqgrid+ztree+echarts

    版权声明:本文为博主原创文章,转载请注明出处.   作为web前端初学者,今天要记录的是三个控件的使用心得,分别是表格控件jqgrid,树形控件ztree,图表控件echarts.下边分别进行描述. ...

  9. Web 页面测试总结—控件类

    web端页面测试,最常见的是基本控件的测试,只有了解常见的控件和其测试方法,才能掌握测试要点,避免漏测情况发生.根据日常工作总结,将控件和常见逻辑集合在一起,总结了几个控件类测试查场景如下. 导航条 ...

随机推荐

  1. Vue示例教程

    <!DOCTYPE html> <html lang="en" xmlns:v-bind="http://www.w3.org/1999/xhtml&q ...

  2. python-函数4(递归、高阶函数)

    python-函数4(递归.高阶函数) 递归 在函数内部,可以调用其他函数.如果一个函数在内部调用自身本身,这个函数就是递归函数. 递归特性: 1. 递归必须有一个明确的结束条件 2. 每次进入更深一 ...

  3. phpstudy使用PHP+nginx配置Laravel

    一.需要注意把vhosts.conf文件内root项目路径的\换成/例如 root "D:/laravelApp/test/public"; 二.若文件根目录下没有 .env1.. ...

  4. DTM/DEM/DSM/DOM/DLG

    一.DTM (Digital Terrain Model) 数字地面模型是利用一个任意坐标系中大量选择的已知x .y .z 的坐标点对连续地面的一个简单的统计表示,或者说,DTM 就是地形表面形态属性 ...

  5. navicat修改表的主键自增长报错

    这周自己在构思一个项目的表的设计,由于是第一次,所以走了很多弯路,也遇到了几个问题,这里暂时贴上来. 我用PowerDesign设计出一部分关联表的ER图之后,导出了sql文件之后用navicat导入 ...

  6. Java并发编程实战 第10章 避免活跃性危险

    死锁 经典的死锁:哲学家进餐问题.5个哲学家 5个筷子 如果没有哲学家都占了一个筷子 互相等待筷子 陷入死锁 数据库设计系统中一般有死锁检测,通过在表示等待关系的有向图中搜索循环来实现. JVM没有死 ...

  7. Python---webserver

    一. # HTTP项目实战 - 深入理解HTTP协议 - 模拟后台服务程序基本流程和大致框架 - 每一个步骤一个文件夹 - 图解http协议,图解tcp/ip协议 # v01-验证技术 - 验证soc ...

  8. C#调用Python(二)

    python文件中有引入其他包.模块 一.源码 1.1  python源码,源码.python 打包方法,以及打包后的程序文件.请移步https://www.cnblogs.com/zhuanjiao ...

  9. shiro框架学习-3- Shiro内置realm

    1. shiro默认自带的realm和常见使用方法 realm作用:Shiro 从 Realm 获取安全数据 默认自带的realm:idae查看realm继承关系,有默认实现和自定义继承的realm ...

  10. 引用自定义的css或者js文件

    用script标签,src是js文件路径 <script type="text/javascript" src="./js/udc.js">< ...