h5可拖动悬浮按钮_js制作可拖拽可点击的悬浮球

// index.html

Document

#ballId {

background: rgb(19, 167, 19);

color: white;

width: 50px;

text-align: center;

height: 50px;

line-height: 50px;

border-radius: 50%;

box-shadow: 5px 5px 40px rgba(0, 0, 0, 0.5);

/* 过渡效果在IE下展示效果不友好 */

transition: all 0.08s;

user-select: none;

-moz-user-select: none;

-ms-user-select: none;

-webkit-user-select: none;

top: 50%;

left: 50%;

transform: translate3d(-50%, -50%, 0);

}

drag

// 使用说明

// 引入suspension-ball.js，调用suspensionBall()方法，第一个参数传要拖动元素的id，第二个参数传点击后的跳转链接

suspensionBall('ballId', 'https://www.baidu.com')

// suspension-ball.js

function suspensionBall(dragId, dragLink) {

var startEvt, moveEvt, endEvt

// 判断