js实现悬浮窗效果(支持拖动)

2023-05-14 22:10| 来源: 网络整理| 查看: 265

经常可以看到大部分的官网有右侧悬浮在线客服。今天来写写！

效果图：

代码如下：

js悬浮窗代码(支持拖动) *{margin:0;padding:0;list-style-type:none;} a,img{border:0;} /* KeFuDiv */ .KeFuDiv{position:absolute;height:160px;width:196px;background: #01C4C6;color:#fff;font-size:20px;text-align: center;cursor: pointer;} .KeFuDiv p{line-height: 80px;font-weight:bold;}

Content Me!!! 我可以拖动哦！！！

//初始位置 gID("KeFuDiv").style.top = (document.documentElement.clientHeight - gID("KeFuDiv").offsetHeight)/2 +"px"; gID("KeFuDiv").style.left = document.documentElement.clientWidth - gID("KeFuDiv").offsetWidth +"px"; //开始滚动 ScrollDiv('KeFuDiv');

以上就是本文的全部内容，希望本文的内容对大家的学习或者工作能带来一定的帮助，同时也希望多多支持脚本之家！

您可能感兴趣的文章:js 鼠标拖动对象可让任何div实现拖动效果javascript 事件处理、鼠标拖动效果实现方法详解js实现可拖动DIV的方法比较精简的Javascript拖动效果函数代码JS实现弹出浮动窗口(支持鼠标拖动和关闭)实例详解js实现图片拖动改变顺序附图JS拖动鼠标画出方框实现鼠标选区的方法JS实现可缩放、拖动、关闭和最小化的浮动窗口完整实例鼠标拖动动态改变表格的宽度的js脚本兼容ie/firefoxJS实现音量控制拖动

【本文地址】

js实现悬浮窗效果(支持拖动)

js实现悬浮窗效果(支持拖动)

今日新闻

推荐新闻