转自:http://zhongzhihua.iteye.com/blog/78894
xul文件:
xml 代码
-
<?
xml
version
=
"1.0"
?>
-
<?
xml-stylesheet
href
=
"chrome://global/skin/"
type
=
"text/css"
?>
-
<
window
title
=
"Widget Dragger"
id
=
"test-window"
orient
=
"horizontal"
xmlns
=
"http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"
>
-
<
script
src
=
"chrome://global/content/nsDragAndDrop.js"
/>
-
<
script
src
=
"chrome://global/content/nsTransferable.js"
/>
-
-
<
script
src
=
"script/DragAndDrop.js"
>
</
script
>
-
<
stack
id
=
"board"
style
=
"width:300px; height: 300px; max-width: 300px; max-height: 300px"
-
ondragexit
=
" alert(2)"
-
ondragover
=
"nsDragAndDrop.dragOver(event,boardObserver)"
ondragdrop
=
"nsDragAndDrop.drop(event,boardObserver)"
>
-
</
stack
>
-
<
vbox
>
-
<
button
label
=
"Button"
elem
=
"button"
ondraggesture
=
"nsDragAndDrop.startDrag(event,listObserver)"
/>
-
<
button
label
=
"Check Box"
elem
=
"checkbox"
ondraggesture
=
"nsDragAndDrop.startDrag(event,listObserver)"
/>
-
<
button
label
=
"Text Box"
elem
=
"textbox"
ondraggesture
=
"nsDragAndDrop.startDrag(event,listObserver)"
/>
-
-
</
vbox
>
-
</
window
>
ondragexit是拖放后的事件,ondragenter是刚拖进去时触发的事件,
js文件:var listObserver = {
onDragStart: function (evt,transferData,action){
var txt=evt.target.getAttribute("elem");
transferData.data=new TransferData();
transferData.data.addDataForFlavour("text/unicode",txt); }
// transferData.data.addDataForFlavour("text/html",txt); }
};
var boardObserver = {
getSupportedFlavours : function () {
var flavours = new FlavourSet();
flavours.appendFlavour("text/unicode"); return flavours;
},
onDragOver: function (evt,flavour,session){},
onDrop: function (evt,dropdata,session){
if (dropdata.data!=""){
var elem=document.createElement(dropdata.data);
evt.target.appendChild(elem);
elem.setAttribute("left",""+evt.pageX);
elem.setAttribute("top",""+evt.pageY);
elem.setAttribute("label",dropdata.data);
}
}
};
分享到:
相关推荐
Drag and Drop Component Suite Version 5.2 Full Source
Ole Drag and Drop Example.
drag and drop 拖放库 vue dnd mobile
Java中的Drag and Drop拖拽技术
jquery实现Drag and Drop,图片拖拽实例
DragAndDrop_Demo源码,是一个很不错的C++源码,有兴趣的伙伴们抽时间可以看一下把。
DragAndDrop_src源码,是一个很不错的C++源码,有兴趣的伙伴们抽时间可以看一下把。
表格拖拽排序插件 Table Drag and Drop JQuery plugin v0.7 最新0.7版本
最近写项目的时候,要用到一个拖拽效果,但是,所以写了一个例子上传到这里,交流学习
wpf,实现了鼠标拖放操作,可以像win7桌面的图标一样拖放
C#实现和windows资源管理器之间相互拖拽文件,并显示文件图标的列子。可以访问blog:http://blog.csdn.net/cc_net查看有关Drag和Drop的文章
一套简化拖放操作的组件包,虽然很老了,不过也支持D7。
看了书上写了这个系统提供的拖拽操作(StartDrag),然后自己尝试多次未能成功,然后又在百度找了很多文章,发现都不尽相同,之后自己总结之后写出了这个demo,希望能够帮到和我之前遇到同样问题的朋友
Drag and Drop Component Suite Full Source
Sliverlight 微软Drag and drop 实例,希望能够给大家有所帮助
A Drag and Drop List Control经典妙用!!!!!!
A Drag and Drop List Control的Demo
这是一个基于.NET编写的window shell,在Drag and Drop的时候能够已图片显示拖动的轨迹。
iOS11 Drag and Drop功能的简单演示 github: https://github.com/xiaopin/iOS11-Drag-and-Drop.git
用VC.NET编写的Drag and Drop练习程序,使用于windows系统