时间:2021-05-25
仿3721首页模块拖曳移动效果[拖曳层移动层]呵,做了一些细致的处理 html, body { width:100%; height:100%; padding:0px; margin:0px; } body { text-align:center; font-size:14px; } .cell_left, .cell_right { width:202px; } .cell_center { width:404px; } .left { float:left; } .row { clear:both; } .r_nbsp { width:20px; } .root { width:876px; height:auto; margin:auto; } .root * { -moz-user-select:none; } .line { width:100%px; height:0px; overflow:hidden; } .move { border:#CCCCCC 1px solid; width:100%; height:aotu; margin-top:5px; margin-bottom:5px; display:none; } .title { height:24px; line-height:24px; background:#0080C0; } .title_a { width:auto; margin-right:80px; cursor:move; font-size:12px; font-weight:bold; color:#FFFFFF; text-align:left; padding-left:10px; } .title_reduce, .title_lock, .title_edit, .title_close { float:right; width:20px; font-size:9px; color:#CCCCCC; } .title_reduce, .title_lock, .title_edit { cursor:pointer; } .title_close { cursor:default; } .content { height:100px; border-top:#CCCCCC 1px solid; background-color:#F7F7F7; font-size:12px; line-height:130%; } .CDrag_temp_div { border:#CCCCCC 1px dashed; margin-top:5px; margin-bottom:5px; } a#DEL_CDrag, a#ADD_CDrag { color:#6699CC; text-decoration:none; } a#DEL_CDrag:hover, a#ADD_CDrag:hover { color:#FF0000; } .Dall_screen, .Iall_screen { position:absolute; left:0px; top:0px; } .Dall_screen { z-index:99; background-color:#000000; filter:alpha(opacity=30); opacity:0.3; } .Iall_screen { z-index:98; filter:alpha(opacity=0); opacity:0; } .Nall_screen { position:absolute; z-index:100; left:300px; top:100px; width:300px; height:auto; border:#6699CC 1px solid; background-color:#F0FAFF; padding:10px 0 10px 0; } .Call_screen { width:100%; height:auto; line-height:30px; font-size:12px; padding-bottom:10px; } [清除记录] [添加记录] 关闭编辑锁定缩小 [Ctrl+A 全选 注:引入外部Js需再刷新一下页面才能执行]
声明:本页内容来源网络,仅供用户参考;我单位不保证亦不表示资料全面及准确无误,也不保证亦不表示这些资料为最新信息,如因任何原因,本网内容或者用户因倚赖本网内容造成任何损失或损害,我单位将不会负任何法律责任。如涉及版权问题,请提交至online#300.cn邮箱联系删除。
本文实例讲述了JS实现可展开折叠层的鼠标拖曳效果。分享给大家供大家参考。具体如下:这是一款简单JS代码实现的鼠标拖曳图层效果,比较精简,大家参考一下。鼠标点击层
本文实例讲述了JS实现可拖曳、可关闭的弹窗效果。分享给大家供大家参考。具体如下:运行该实例,点击文字,弹出一个窗口,其实是一个弹出层,这个弹出层可以随鼠标拖曳,
弹出层、弹窗效果+拖曳功能*{margin:0px;padding:0px;}body{font-size:12px;font:Arial,Helvetica,
js实现鼠标的拖曳效果,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下效果如下:下面是代码:鼠标拖曳效果body{backgrou
本文实例为大家分享了js实现图片拖曳效果的具体代码,供大家参考,具体内容如下Title#pbox{width:100%;height:100%;}#box{wi