- 浏览: 408104 次
- 性别:
- 来自: 北京
文章分类
- 全部博客 (347)
- java基础 (58)
- ajax (10)
- s2sh (10)
- 版本控制 (4)
- 数据库 (34)
- 服务器 (4)
- 开发工具 (8)
- javascript (15)
- soockte (5)
- ext (2)
- 环境搭建 (7)
- struts2 (9)
- 找工作中的面试技巧 (2)
- 承接网站零活 (0)
- JNI+JONSE+OGNL (8)
- 性能优化 (4)
- Android开发 (5)
- xul (8)
- jquery (2)
- 线程 (3)
- jsp+jdbc (7)
- servlet (2)
- java对xml操作 (1)
- IO流的操作 (10)
- 项目开发前配置 (1)
- css (0)
- 上传、下载 (2)
- 知识探讨 (2)
- html (2)
- HQL (0)
- 工作技巧 (1)
- IT (1)
- Hibernate杂谈 (10)
- Spring杂谈 (35)
- DWR (5)
- JUnit测试 (3)
- EasyMock测试web (1)
- ibatis (6)
- maysql (5)
- C++ (0)
- 正则表达式(解剖) (1)
- 密码安全 (2)
- 上传 (1)
- socket (1)
- jni(java与c++结合) (1)
- jdk版本问题 (0)
- tomcat版本问题 (5)
- linux基本命令(初学) (7)
- linux项目发布 (1)
- 3年的经验总结 (1)
- 加解密 (2)
- 高级java阶段 (2)
- java内存分区 (1)
- 浏览器 (1)
- 职业规划 (1)
- 管理 (5)
- java语音 (1)
- SSH (1)
- jsp (3)
- extjs (1)
- uml (2)
- 加密 (1)
- web (2)
- Ant (1)
- 自述 (1)
- Linux (1)
- ssh源码解剖 (1)
- 代码优化 (1)
- 设计模式 (0)
- xml (2)
- JOSN (1)
- scala (0)
- hadoop (0)
- spark (0)
- hana (1)
- shior (1)
- java Word (6)
- java PDF (4)
- java Excel (0)
最新评论
-
高级java工程师:
ztao2333 写道谢谢。收藏下这个总结。呵呵
温习jdk和tomcat -
ztao2333:
大写的,不是大学的
温习jdk和tomcat -
ztao2333:
谢谢。收藏下这个总结。
温习jdk和tomcat -
the_small_base_:
你好,可以提供调用方法吗?需要的Jar,能发下源码吗?谢谢
java实现语音 -
高级java工程师:
文思涌动 写道楼主新年好。可否再传一遍给我,我没有收到, 不清 ...
s2sh整合
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>定位</title>
<script type="text/javascript">
function getRealStyle(obj,s) {
var style;
if (window.getComputedStyle) {//W3C DOM
style=window.getComputedStyle(obj,null);
} else if (obj.currentStyle) {//IE
style=obj.currentStyle;
}
return style[s];
}
function innerSize() {
return {
width:document.documentElement.clientWidth,
height:document.documentElement.clientHeight
};
}
window.onload=function () {
var oDiv=document.getElementById("oDiv");
/*var w=getRealStyle(oDiv,'width'),
h=getRealStyle(oDiv,'height');
var innerDiv=document.getElementById("innerDiv");
var w=oDiv.clientWidth,
h=oDiv.clientHeight,
sw=oDiv.scrollWidth,
sh=oDiv.scrollHeight,
ow=oDiv.offsetWidth,
oh=oDiv.offsetHeight,
size=innerSize(),
cl=oDiv.clientLeft,
ct=oDiv.clientTop,
x=oDiv.offsetLeft,
y=oDiv.offsetTop;
//alert(w+"\n"+h);
//alert(ow+"\n"+oh);
//alert(size.width+"\n"+size.height);
//alert(sw+"\n"+sh);
//alert(x+"\n"+y);
//alert(innerDiv.offsetLeft+"\n"+innerDiv.offsetTop);
//alert(innerDiv.offsetParent.tagName);
//var de=document.documentElement;
//alert(de.scrollLeft+"\n"+de.scrollTop);
addEvent(oDiv,'click',function (evt) {
//alert("Client:"+"\n"+evt.clientX+"\n"+evt.clientY);
//alert(evt.layerX+"\n"+evt.layerY);
//alert("Page:"+"\n"+evt.pageX+"\n"+evt.pageY);
//Opera支持addEventListener方法,但不支持layerX/layerY
//Opera使用offsetX/offsetY
});*/
addEvent(oDiv,'mousedown',function (evt) {
evt.preventDefault();
this.flag=true;
this.savedMousePos={
x:evt.layerX,
y:evt.layerY
};
});
addEvent(oDiv,'mousemove',function (evt) {
evt.preventDefault();
if (!this.flag) {
return;
}
this.style.left=evt.clientX-this.savedMousePos.x+"px";
this.style.top=evt.clientY-this.savedMousePos.y+"px";
});
addEvent(document,'mouseup',function (evt) {
oDiv.flag=false;
});
};
function addEvent(obj,evt,fn) {
if (obj.addEventListener) {
if (String(window.opera)=="[object Opera]") {
obj.addEventListener(evt,function (evt) {
evt.layerX=evt.offsetX;
evt.layerY=evt.offsetY;
fn.call(this,evt);
},false);
} else {
obj.addEventListener(evt,fn,false);
}
obj.addEventListener(evt,fn,false);
return obj;
}
if (!obj.functions) obj.functions={};
if (!obj.functions[evt])
obj.functions[evt]=[];
//obj.functions["mousedown"]=[]
var functions=obj.functions[evt];
for (var i=0;i<functions.length;i++) {
if (functions[i]===fn) return obj;
}
functions.push(fn);
//fn.index=functions.length-1;
if (typeof obj["on"+evt]=="function") {
//alert(obj["on"+evt]);//当这一行执行到时,obj["on"+evt] 就是handler
//alert(obj["on"+evt]==handler);
if (obj["on"+evt]!=handler)
functions.push(obj["on"+evt]);
}
obj["on"+evt]=handler;
return obj;
}
function handler() {//哪个事件发生了?
//对event对象标准化
var evt=fixEvt(window.event);
var evtype=evt.type;
var functions=this.functions[evtype];
for (var i=0;i<functions.length;i++) {
if (functions[i]) functions[i].call(this,evt);
}
}
function fixEvt(evt) {
evt.target=evt.srcElement;
if (evt.type=="mouseover")
evt.relatedTarget=evt.fromElement;
else if ("mouseout"==evt.type)
evt.relatedTarget=evt.toElement;
evt.stopPropagation=function () {
evt.cancelBubble=true;
};
evt.preventDefault=function () {
evt.returnValue=false;
};
evt.layerX=evt.offsetX;
evt.layerY=evt.offsetY;
evt.pageX = evt.clientX+document.documentElement.scrollLeft;
evt.pageY = evt.clientY+document.documentElement.scrollTop;
return evt;
}
</script>
<style type="text/css">
#oDiv {
width:200px;
height:200px;
border:3px ridge aqua;
background:blue;
position:absolute;
left:100px;
top:100px;
}
#innerDiv {
width:30px;
height:30px;
margin:4px;
border:10px outset yellow;
background:fuchsia;
}
</style>
</head>
<body class="redStyle">
<h1>定位</h1>
<div id="oDiv">
</div>
</body>
</html>
效果看附件:
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>定位</title>
<script type="text/javascript">
function getRealStyle(obj,s) {
var style;
if (window.getComputedStyle) {//W3C DOM
style=window.getComputedStyle(obj,null);
} else if (obj.currentStyle) {//IE
style=obj.currentStyle;
}
return style[s];
}
function innerSize() {
return {
width:document.documentElement.clientWidth,
height:document.documentElement.clientHeight
};
}
window.onload=function () {
var oDiv=document.getElementById("oDiv");
/*var w=getRealStyle(oDiv,'width'),
h=getRealStyle(oDiv,'height');
var innerDiv=document.getElementById("innerDiv");
var w=oDiv.clientWidth,
h=oDiv.clientHeight,
sw=oDiv.scrollWidth,
sh=oDiv.scrollHeight,
ow=oDiv.offsetWidth,
oh=oDiv.offsetHeight,
size=innerSize(),
cl=oDiv.clientLeft,
ct=oDiv.clientTop,
x=oDiv.offsetLeft,
y=oDiv.offsetTop;
//alert(w+"\n"+h);
//alert(ow+"\n"+oh);
//alert(size.width+"\n"+size.height);
//alert(sw+"\n"+sh);
//alert(x+"\n"+y);
//alert(innerDiv.offsetLeft+"\n"+innerDiv.offsetTop);
//alert(innerDiv.offsetParent.tagName);
//var de=document.documentElement;
//alert(de.scrollLeft+"\n"+de.scrollTop);
addEvent(oDiv,'click',function (evt) {
//alert("Client:"+"\n"+evt.clientX+"\n"+evt.clientY);
//alert(evt.layerX+"\n"+evt.layerY);
//alert("Page:"+"\n"+evt.pageX+"\n"+evt.pageY);
//Opera支持addEventListener方法,但不支持layerX/layerY
//Opera使用offsetX/offsetY
});*/
addEvent(oDiv,'mousedown',function (evt) {
evt.preventDefault();
this.flag=true;
this.savedMousePos={
x:evt.layerX,
y:evt.layerY
};
});
addEvent(oDiv,'mousemove',function (evt) {
evt.preventDefault();
if (!this.flag) {
return;
}
this.style.left=evt.clientX-this.savedMousePos.x+"px";
this.style.top=evt.clientY-this.savedMousePos.y+"px";
});
addEvent(document,'mouseup',function (evt) {
oDiv.flag=false;
});
};
function addEvent(obj,evt,fn) {
if (obj.addEventListener) {
if (String(window.opera)=="[object Opera]") {
obj.addEventListener(evt,function (evt) {
evt.layerX=evt.offsetX;
evt.layerY=evt.offsetY;
fn.call(this,evt);
},false);
} else {
obj.addEventListener(evt,fn,false);
}
obj.addEventListener(evt,fn,false);
return obj;
}
if (!obj.functions) obj.functions={};
if (!obj.functions[evt])
obj.functions[evt]=[];
//obj.functions["mousedown"]=[]
var functions=obj.functions[evt];
for (var i=0;i<functions.length;i++) {
if (functions[i]===fn) return obj;
}
functions.push(fn);
//fn.index=functions.length-1;
if (typeof obj["on"+evt]=="function") {
//alert(obj["on"+evt]);//当这一行执行到时,obj["on"+evt] 就是handler
//alert(obj["on"+evt]==handler);
if (obj["on"+evt]!=handler)
functions.push(obj["on"+evt]);
}
obj["on"+evt]=handler;
return obj;
}
function handler() {//哪个事件发生了?
//对event对象标准化
var evt=fixEvt(window.event);
var evtype=evt.type;
var functions=this.functions[evtype];
for (var i=0;i<functions.length;i++) {
if (functions[i]) functions[i].call(this,evt);
}
}
function fixEvt(evt) {
evt.target=evt.srcElement;
if (evt.type=="mouseover")
evt.relatedTarget=evt.fromElement;
else if ("mouseout"==evt.type)
evt.relatedTarget=evt.toElement;
evt.stopPropagation=function () {
evt.cancelBubble=true;
};
evt.preventDefault=function () {
evt.returnValue=false;
};
evt.layerX=evt.offsetX;
evt.layerY=evt.offsetY;
evt.pageX = evt.clientX+document.documentElement.scrollLeft;
evt.pageY = evt.clientY+document.documentElement.scrollTop;
return evt;
}
</script>
<style type="text/css">
#oDiv {
width:200px;
height:200px;
border:3px ridge aqua;
background:blue;
position:absolute;
left:100px;
top:100px;
}
#innerDiv {
width:30px;
height:30px;
margin:4px;
border:10px outset yellow;
background:fuchsia;
}
</style>
</head>
<body class="redStyle">
<h1>定位</h1>
<div id="oDiv">
</div>
</body>
</html>
效果看附件:
发表评论
-
document.createElement()的用法
2013-08-06 15:46 837document.createElement()的用法 ... -
js或jquery实现页面打印
2013-01-23 12:52 914方法多多,自己收集一下 1、js实现(可实现局部打印) & ... -
js操作数据库
2012-01-17 17:17 1062JavaScript操作数据库JS操作Access数据库,跟其 ... -
js关掉浏览器-通用
2011-10-11 17:41 953js直接关闭窗口不提示ie6.0,ie7.0通用 ... -
javascript实现页面跳转的几种方式
2011-04-07 15:08 833第一种: <script language=" ... -
javascript读写文件操作
2011-03-30 16:29 839<script> /* object.Open ... -
javascript实现用户登录保存帐号密码(保存在cookies中)
2011-03-30 16:26 1564/*这个是html的名字123.html*/ <SCR ... -
js点击按钮出现进程条
2011-03-03 15:43 1232<!DOCTYPE html PUBLIC " ... -
javascript特性概念
2011-03-03 14:57 845加载: 使页面从新加载一遍:window.location. ... -
DOM一般属性
2011-02-23 15:16 8621Attributes 存储节点的属 ... -
单给文件上传,区分文件类型?
2011-02-23 14:33 848<html> <head> &l ... -
如何保证刷新页面去新的页面后数据还在?
2011-02-23 14:31 901<html> <head> <s ... -
js大全手册
2011-01-28 15:15 10431.document.write(""); ... -
javascript基本使用
2011-01-28 08:29 8701.JS对象操作语句 : with 语句的语法: ...
相关推荐
JS实现的拖拉缩放效果(实例讲解) JS实现的拖拉缩放效果(实例讲解)
很强大很牛的实现div拖拉的js插件,主要使用jquery写的,在调用该插件是务必先引用js1.4或js1.6
简单的一个js操作div例子,模拟聊天窗口,实现拖拉控制div高度等功能,有需要的可以看看,对谷歌,IE,360,火狐,op都已兼容。
JavaScript(简称JS)是一种轻量级的脚本语言,广泛应用于网页和网络应用开发,能够实现动态内容、用户交互、页面行为控制等。在本压缩包"js拖拉效果.rar"中,包含的是一个实现拖放(Drag and Drop)效果的示例。...
jQuery,作为一个强大的JavaScript库,提供了丰富的API来帮助开发者轻松实现拖拽效果,特别是在布局管理上。本文将深入探讨如何利用jQuery实现拖拉布局,并分享相关知识点。 ### 1. jQuery UI中的Draggable和...
拖拉缩放效果,实现通过鼠标拖动来调整层的面积(宽高)大小。例如选框效果。 这里的拖拉缩放比一般的选框复杂一点,能设置八个方位(方向)的固定触发点,能设置最小范围,最大范围和比例缩放。 这里也有一个简化...
js拖拉图片,实现缩放等其他功能,代码可修改,
在IT领域,特别是图形用户界面(GUI)开发中,实现拖放(Drag and Drop)功能是一项常见的需求。本文将深入探讨如何使用Qt框架来实现图片的拖放操作,并结合Visio流程图的设计理念,创建一个允许用户自由拼接图片的...
下面我们将详细讨论如何利用HTML5和JavaScript实现拖拉上传文件。 首先,我们需要了解与拖放操作相关的几个事件: 1. `ondragstart`:当用户开始拖动元素时触发,可以在这个事件中设置数据传输对象`dataTransfer`...
vc对话框,无边框窗口实现拖拉效果OnNcHitTest,OnSetCursor,OnNcLButtonDown
拖拉缩放效果,实现通过鼠标拖动来调整层的面积(宽高)大小。例如选框效果。 这里的拖拉缩放比一般的选框复杂一点,能设置八个方位(方向)的固定触发点,能设置最小范围,最大范围和比例缩放。 跟拖放效果一样,...
html拖拉js ${item}.ftl"> ('')"> 审批"> 世世代代的 var node = document.querySelector("#szul"); var draging = null; //使用事件委托,将li的事件委托给...
在机器学习领域,为了提升...通过解压并研究"workflow-svg-drag-core-master"中的代码,开发者可以学习到如何使用SVG和JavaScript实现类似的交互式图形应用,这对于提升机器学习项目的人机交互体验有着重要的实际意义。
在某些场景下,如新闻频道管理,用户可能需要能够自由调整各元素的顺序,这时就需要实现自定义的GridView来支持拖放功能。下面将详细讲解如何实现这个功能。 首先,我们需要了解`GridView`的基本用法。`GridView`...
js实现进度拖拽效果
标题中的“实现鼠标拖拉的简单实例1.0”指的是一个基本的计算机程序或软件功能,允许用户通过鼠标进行拖放操作。在编程领域,这种功能通常涉及到事件处理和图形用户界面(GUI)的设计。在这个实例中,可能是用某种...
Echarts/PyQT/Flask实现的 动态实时拖拉拽大屏 ,重点的事情说三遍:自定义拖拉拽,自定义拖拉拽,自定义拖拉拽!!! YYDatav的数据可视化大屏《精彩案例汇总》(Python&Echarts源码) ... ...YYDatav的数据可视化大屏...
标题中的“dom-drag”指的是在JavaScript中实现...通过研究这个压缩包的内容,我们可以学习到JavaScript实现DOM拖放的完整流程,包括事件处理、数据交换和样式调整等关键点,并且能掌握如何在实际项目中运用这些知识。
本项目"react版拖拉拽表单"正是基于React.js实现的,允许用户通过拖放操作自定义构建表单。在深入探讨这个项目之前,我们先来了解一下React.js的基础知识。 React.js是Facebook开发的一款JavaScript库,用于构建...
除了基本的JavaScript实现,还可以借助一些库如`interact.js`或`dragula.js`来简化拖拽布局的开发。这些库提供了高级功能,如多元素拖放、拖放组、镜像元素等,能够帮助开发者快速构建复杂的拖拽布局系统。 总的来...