JS实现动态移动层及拖动浮层关闭的方法

 　　本文实例讲述了JS实现动态移动层及拖动浮层关闭的方法。分享给大家供大家参考。具体实现方法如下：

　　?

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45

<html>
<head>
<title>动态移动的层</title>
<body bgcolor="#ADBAC9">
<div id="div1" class="yellow" style="VISIBILITY:visible ;
background-color:#FFFF00;
position: absolute; top: 60; left: 200;
width: 360; height: 250;
filter: revealTrans(transition=12, 'duration=0.1)
blendTrans(duration=0.1) ">
<div id=title onmousedown=DIVDown("div1")
style="background-color:#30608F;padding:2px;
font-size:13px;text-indent:5;
color:#FFFFFF;cursor:move">标题</div>
<img id=close onclick=Hide(div1)
style="position: absolute; right: 2; top: 2" border="0"
src="close.gif" width="15" height="15">
</div>
<script language="JavaScript">
var Obj="none";
var pX
var pY
document.onmousemove=DIVMove;
document.onmouseup=DIVUp;
function DIVDown(tag){
Obj=tag;
pX=parseInt(document.all(Obj).style.left)-event.x;
pY=parseInt(document.all(Obj).style.top)-event.y;
}
function DIVMove(){
if(Obj!="none"){
document.all(Obj).style.left=pX+event.x;
document.all(Obj).style.top=pY+event.y;
event.returnValue=false;
}
}
function DIVUp(){Obj="none";}
function Hide(divid){
divid.filters.revealTrans.apply();
divid.style.visibility = "hidden";
divid.filters.revealTrans.play();
}
</script>
</body>
</html>

　　希望本文所述对大家的javascript程序设计有所帮助。

时间： 2024-11-01 03:48:59

JS实现动态移动层及拖动浮层关闭的方法的相关文章

JS实现动态移动层及拖动浮层关闭的方法_javascript技巧

本文实例讲述了JS实现动态移动层及拖动浮层关闭的方法.分享给大家供大家参考.具体实现方法如下: <html> <head> <title>动态移动的层</title> <body bgcolor="#ADBAC9"> <div id="div1" class="yellow" style="VISIBILITY:visible ; background-color:#FF

JS控制一个DIV层在指定时间内消失的方法_javascript技巧

复制代码 代码如下: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title>定时关闭的层<

DIV层之拖动、关闭、打开效果代码_javascript技巧

[打开层] [关闭层] 移动层 <

项目中通过js动态创建层的方法为表单添加错误提示

本文介绍利用动态创建层技术实现无冗余代码为表单自动添加错误提示的方法. 项目中表单输入检测是基本必定会碰到的,本文提供一种方法通过js动态创建层的方法为表单添加错误提示.该代码在IE6和firefox3.5中测试通过. 动态创建层的代码: function createDiv(msg) { //create a new empty p var str = document.createElement("p"); str.id = "newp"; //p ID str

JS实现简洁、全兼容的拖动层实例

  本文实例讲述了JS实现简洁.全兼容的拖动层.分享给大家供大家参考.具体分析如下: 这是一款最简洁的JS层拖动代码,全兼容ie.ff.opera.safari--每一种浏览器都有对应的判断和实现方法,你只需复制代码到你的网页中就可使用.水平高的朋友可以继续修改,添加更多方法,使其功能更强大. ? 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 3

JS实现简洁、全兼容的拖动层实例_javascript技巧

本文实例讲述了JS实现简洁.全兼容的拖动层.分享给大家供大家参考.具体分析如下: 这是一款最简洁的JS层拖动代码,全兼容ie.ff.opera.safari--每一种浏览器都有对应的判断和实现方法,你只需复制代码到你的网页中就可使用.水平高的朋友可以继续修改,添加更多方法,使其功能更强大. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1

Jquery 实现层的拖动，支持回调函数

最近在写一个CMS内容管理系统,前台基本是用ajax异步请求服务器,通过ashx处理,返回json格式处理.由于需要更加人性化的界面,所以采用到了拖动层的操作. 以下是拖动层的主要核心方法,本来想写成插件的,考虑的没那么多时间,就以方法的方式了. /*  * Jquery 鼠标左键拖动面板  * coder:新生帝  * obj:jQuery选择器名称  * callback:回调函数(拖动停止要执行的函数),可通过$(this)获取 obj 对象  */  function movePanel

js控制的遮罩层实例介绍

 闲来无事,把项目里很土的弹窗,改成了遮罩层显示,感觉效果好点了.上代码:  父页面:   代码如下: <div id='newDiv1' style="display: none;">  <%@include file='/WEB-INF/jsp/infobackup/martyr/printCertDia.jsp' %>  <%--<jsp:include page="/WEB-INF/jsp/infobackup/martyr/pri

js控制的遮罩层实例介绍_javascript技巧

闲来无事,把项目里很土的弹窗,改成了遮罩层显示,感觉效果好点了.上代码: 父页面: 复制代码 代码如下: <div id='newDiv1' style="display: none;"> <%@include file='/WEB-INF/jsp/infobackup/martyr/printCertDia.jsp' %> <%--<jsp:include page="/WEB-INF/jsp/infobackup/martyr/prin