Js代码动态移动层-拖动浮层并关闭

<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>

<div>http://www.999jiujiu.com/</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>

时间: 2024-08-30 08:22:35

Js代码动态移动层-拖动浮层并关闭的相关文章

鼠标选择文字事件js代码,增加层问题

在页面中增加一个js代码,当用户用鼠标选择文字(鼠标拖动涂蓝文字)时,会出现一个层,提示与这个选择文字有个的信息<script type="text/javascript">document.onmouseup = document.ondbclick= function(){ var txt; if(document.selection){  txt = document.selection.createRange().text }else{  txt = window.

JS代码动态生成遮罩层、蒙层

//父层级设置显示样式 document.getElementById("maskDiv").style.display = 'block'; //子节点设置样式var mask = document.createElement('div'); mask.id = 'maskDiv'; mask.style.width = window.innerWidth +'px'; mask.style.height = window.innerHeight +'px'; mask.style.

完整的网页浮动层拖动实例代码

一个供学习不错的网页拖动层,具有丰富的层拖动设置功能,比如可设置拖动的范围.垂直.水平方向拖动,是否透明显示层等,运用JS和CSS等实现的HTML层拖动网页,代码完整:前端框架资源分享 .代码   <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html

动态加载JS代码

到处查资料研究js动态脚本的加载,找到以下7种方法,总有一种适合你! 首先我们需要一个被加载的js文件,我在一个固定文件夹下创建了一个package.js,打开后在里面写一个方法functionOne,很简单,代码如下: function functionOne(){ alert("成功加载"); } 后面的html文件都创建在同一个目录下. 方法一:直接document.write 在同一个文件夹下面创建一个function1.html,代码如下: <html> <

JQuery - 动态添加Html后,如何使CSS生效,JS代码可用?

今天在开发JQuery Mobile程序时候,需要从服务器取得数据,随后显示在页面上的Listview控件中,数据完整获取到了,也动态添加到Listview控件中,但是数据对应的CSS没有任何效果了,而且操作数据的JS代码也不好使了!!! 一,使动态加载数据对应的CSS生效. //刷新Listview,使CSS生效 $("#控件ID").listview("refresh"); 在加载完数据代码之后,加入上面代码,把"控件ID"换成你的真正的Li

JavaScript:Div层拖动效果

Div层拖动效果图: 实现: CSS: <style> div { position:relative; } </style> JS: <script type="text/javascript"> var mouseover=true var xcoor; var ycoor; function coordinates() { if (event.srcElement.id.indexOf("wishbroad") == 0)

【ASP.NET Web API教程】2.3.5 用Knockout.js创建动态UI

注:本文是[ASP.NET Web API系列教程]的一部分,如果您是第一次看本博客文章,请先看前面的内容. Part 5: Creating a Dynamic UI with Knockout.js 第5部分:用Knockout.js创建动态UI 本文引自:http://www.asp.net/web-api/overview/creating-web-apis/using-web-api-with-entity-framework/using-web-api-with-entity-fra

Fiddler调试线上JS代码

强力推荐一款js调试神器,Fiddler 大家平时肯定都用过火狐的Firebug或者谷歌的调试工具来调试JS,但遗憾的是我们不能像编辑html,css那样来直接新增或者删除JS代码. 虽然可以通过调试工具的控制台来动态执行JS代码,但有时候却远远不够用. 特别是当产线环境不能随意修改文件情况下,用线上环境来调试本地代码更是迫切的需求. (往往本地测试通过,上线后却是各种bug.) 今天分享一下如何用Fiddler来修改并调试线上的JS代码. 以博客园首页为例子,用我本地的一个js文件来替换它的一

最新的JavaScript核心语言标准&mdash;&mdash;ES6,彻底改变你编写JS代码的方式!【转载+整理】

原文地址 本文内容 ECMAScript 发生了什么变化? 新标准 版本号6 兑现承诺 迭代器和for-of循环 生成器 Generators 模板字符串 不定参数和默认参数 解构 Destructuring 箭头函数 Arrow Functions Symbols 集合 学习Babel和Broccoli,马上就用ES6 代理 Proxies ES6 说自己的宗旨是"凡是新加入的特性,势必已在其它语言中得到强有力的实用性证明."--TRUE!如果你大概浏览下 ES6 的新特性,事实上它