jQuery实现移动端悬浮拖动效果

模拟手机端悬浮按钮功能,自动吸附两边,并且不能超过活动区域,上下超过自动吸附上或下
【jQuery实现移动端悬浮拖动效果】jQuery实现移动端悬浮拖动效果
文章图片

jQuery实现移动端悬浮拖动效果
文章图片

因为是移动端端事件,需要调试到移动端才可以看效果
jQuery实现移动端悬浮拖动效果
文章图片

以下是代码

Document - 锐客网.service_s {position: fixed; top: 0; left: 0; right: 0; bottom: 0; z-index: 1; display: none; }* {padding: 0; margin: 0; }.content {position: fixed; top: 10%; right: 3%; left: 3%; bottom: 10%; border: 1px solid #cccc77; background: #cccc77; display: flex; align-items: center; color: #fff; font-weight: 600; justify-content: center; }.service {position: fixed; top: 60%; right: 3%; height: 40px; width: 40px; background: #0baefd; z-index:9}活动区域

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持脚本之家。

    推荐阅读