先下载: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 Cli 移动端开发

    一.

  2. python virtualenv和virtualenv的使用

    首先下面的步骤我都是在windows下执行,Python2.7,pip==19.1.1 1.安装virtualenv pip install virtualenv 2.新建virtualenv vir ...

  3. CreateRemoteThread

    CreateRemoteThread是一个Windows API函数,它能够创建一个在其它进程地址空间中运行的线程(也称:创建远程线程)..

  4. Python核心技术与实战——十四|Python中装饰器的使用

    我在以前的帖子里讲了装饰器的用法,这里我们来具体讲一讲Python中的装饰器,这里,我们从前面讲的函数,闭包为切入点,引出装饰器的概念.表达和基本使用方法.其次,我们结合一些实际工程中的例子,以便能再 ...

  5. Kendo UI使用教程:Bower Packages

    [Kendo UI最新试用版下载] Kendo UI目前最新提供Kendo UI for jQuery.Kendo UI for Angular.Kendo UI Support for React和 ...

  6. mysql——InnoDB 锁

    https://www.cnblogs.com/leedaily/p/8378779.html 1.InnoDB锁的实现方式:给索引项加锁,只有通过索引条件检索数据,InnoDB才使用行级锁,否则,I ...

  7. 【crontab】误删crontab及其恢复

    中秋节快到了,首先祝自己中秋快乐. 昨天下午六点,心里正想着加完一个crontab就可以下班了.本来想执行 crontab -e的,没想到手一抖就输入了crontab ,然后就进入了下面这个样子.

  8. 对vue虚拟dom的研究

    Vue.js通过编译将template 模板转换成渲染函数(render ) ,执行渲染函数就可以得到一个虚拟节点树 在对 Model 进行操作的时候,会触发对应 Dep 中的 Watcher 对象. ...

  9. SpringBoot的项目构建

    手动构建SpringBoot项目 一.手动构建一个Maven,选择...webapp或者选择快速骨架生成,然后命名并生成项目: 二.  在pom.xml中,进行三处配置: 设置父模块,子模块就可以继承 ...

  10. javax.validation.UnexpectedTypeException: HV000030: No validator could be found for constraint,NotBlank判断不能为空

    java 验证出现如下错误: javax.validation.UnexpectedTypeException: HV000030: No validator could be found for c ...