先下载: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. iconv - 字符集转换

    总览 (SYNOPSIS) iconv [-f encoding] [-t encoding] [inputfile ...] 描述 (DESCRIPTION) iconv 程序 把 文本 从 一种 ...

  2. .net中对象序列化技术

    序列化是将对象状态转换为可保持或传输的格式的过程.与序列化相对的是反序列化,它将流转换为对象.这两个过程结合起来,可以轻松地存储和传输数据.例如,可以序列化一个对象,然后使用 HTTP 通过 Inte ...

  3. yaourt

    https://blog.csdn.net/relcodego/article/details/50531379 https://blog.csdn.net/lsvtogergo/article/de ...

  4. Ubuntu利用ROS搭建手机移动网络摄像头(Android)

    所需设备 PC -> Ubuntu 16.04 - > ROS Kinetic Android系统手机 1.Android移动端APP下载安装 配置手机端:(一般默认即可RTSP) 2.源 ...

  5. enums应用详解

    枚举类: 获取枚举相关值:

  6. Vue原理解析——自己写个Vue

    Vue由于其高效的性能和灵活入门简单.轻量的特点下变得火热.在当今前端越来越普遍的使用,今天来剖析一下Vue的深入响应式原理. tips:转自我的博客唐益达博客,此为原创.转载请注明出处,原文链接 一 ...

  7. Linux网络性能优化方法简析

    Linux网络性能优化方法简析 2010-12-20 10:56 赵军 IBMDW 字号:T | T 性能问题永远是永恒的主题之一,而Linux在网络性能方面的优势则显而易见,这篇文章是对于Linux ...

  8. IP地址(参考百度百科)

    题目1:用子网掩码划分网络时,如果划分8个子网,则需要4位.因为24-2>=8.(全0代表网络自身,全1代表广播地址,所以减2) 以C类地址为例,(1)8个子网,则4位子网,主机号为后4位,主机 ...

  9. 【NOIP2016提高A组模拟8.15】Throw

    题目 分析 首先对于一个状态(a,b,c),假定a<=b<=c: 现在考虑一下这个状态,的转移方案: \[1,中间向两边跳(a,b,c)-->(a*2-b,a,c).(a,b,c)- ...

  10. GO语言学习笔记4-int与string类型转换

    int与string类型之间相互转换可以借助strconv包里自带的函数实现. 1.string转换成int 函数原型: // base指定进制(2到36),如果base为0,则会从字符串前置判断, ...