Vue使用vue-drag-resize生成悬浮拖拽小球 Vue使用vue-drag-resize生成悬浮拖

本文实例为大家分享了使用vue-drag-resize生成悬浮拖拽小球的具体代码，供大家参考，具体内容如下
一、下载依赖

cnpm installvue-drag-resize

二、main.js引用

import VueDragResize from 'vue-drag-resize'Vue.component('vue-drag-resize', VueDragResize)

三、创建组件

#moreModal {width: 50px; height: 50px; border-radius: 50%; background-color: #337AB7; line-height: 40px; text-align: center; color: #fff; opacity: 0.6; animation: light 2s ease-in-out infinite alternate; cursor: pointer}@keyframes light {from {box-shadow: 0 0 4px #1f8cfa; }to {box-shadow: 0 0 20px #1f8cfa; }}#moreModal.active:before {content: ""; width: 100%; height: 100%; top: 0; left: 0; outline: none; }

四、展示 【Vue使用vue-drag-resize生成悬浮拖拽小球】