jsMind通过鼠标拖拽的方式调整节点位置_javascript技巧

jsMind是一个纯javascript实现的思维导图类库,基于html5的canvas实现,以BSD协议开源。

提供了思维导图的显示,编辑等功能,支持freemind数据格式,有丰富的开发接口可供使用,具体功能请访问软件主页进一步了解。

jsMind 现已支持通过鼠标拖拽的方式调整节点位置了。只需引用最新版本的 jsmind.js 以及 jsmind.draggable.js 即可使用该功能。需要注意的是,当思维导图设置为不可编辑的时候,拖拽功能也将同时禁止。

请访问 项目主页:http://hizzgdev.github.io/jsmind/ 体验效果。

复制代码 代码如下:

<script type="text/javascript" src="js/jsmind.js"></script>
<!-- 只需添加下方 js 引用即可 -->
<script type="text/javascript" src="js/jsmind.draggable.js"></script>

以上所述就是本文的全部内容了,希望大家能够喜欢。

时间: 2024-09-25 22:56:43

jsMind通过鼠标拖拽的方式调整节点位置_javascript技巧的相关文章

jsMind通过鼠标拖拽的方式调整节点位置

 <script type="text/javascript" src="js/jsmind.js"></script> <!-- 只需添加下方 js 引用即可 --> <script type="text/javascript" src="js/jsmind.draggable.js"></script>

JavaScript实现拖拽网页内元素的方法_javascript技巧

本文实例讲述了JavaScript实现拖拽网页内元素的方法.分享给大家供大家参考.具体如下: 这段代码详细讲述了JS拖拽的原理和方法,值得学习和借鉴. /** * 跨平台的事件监听函数 * @param {Node} node 需要监听事件的DOM节点 * @param {String} eventType 需要监听的事件类型 * @param {Function} callback 事件监听回调函数 * @type Function 返回值为函数类型 * @return 返回监听回调函数的引用

javascript拖拽应用实例(二)_javascript技巧

经常在网站别人的网站的注册页中看到一个拖拽验证的效果,就是它的验证码刚开始不出来,而是有一个拖拽的条,你必须将这个拖拽条拖到底,验证码才出来,说了感觉跟没说一样,你还是不理解,好吧,我给个图你看看: 这个是在万网的注册页中所截的图,大概的效果就是,当拖动那个拖拽框时,如果拖拽框没有拖到最右边,则拖拽框会移动到初始位置,如果拖动到最右边,则拖拽框显示为对勾,中间的文字也变了,但是我试了一下,他的验证码的框没有出来,不知道是改了还是怎么的,我没有继续点击确定往下进行,那不是我们要讲的重点,我就在他的

纯JS实现可拖拽表单的简单实例_javascript技巧

因为要用到可拖拽表单,个人要比较喜欢自己动手,不怎么喜欢在不懂实现或者原理的情况下用插件,所以查找资料实现了一个. 思路:放入:用mousedown判断鼠标点击的位置是否在触发控件的位置,如果是,mousemove的时候clone一个控件,修改透明度,然后放入容器内的时候remove这个控件,并且在容器内生成一个放入的控件(放入的控件和触发的控件可以不一样) 拖拽:同样的, mousedown的时候判断是哪个控件,mousemove的时候需要放一个占位div放在原有的位置上,并将元素修改透明度然

再次谈论React.js实现原生js拖拽效果引起的一系列问题_javascript技巧

React 起源于 Facebook 的内部项目,因为该公司对市场上所有 JavaScript MVC 框架,都不满意,就决定自己写一套,用来架设 Instagram 的网站.做出来以后,发现这套东西很好用,就在2013年5月开源了.由于 React 的设计思想极其独特,属于革命性创新,性能出众,代码逻辑却非常简单.所以,越来越多的人开始关注和使用,认为它可能是将来 Web 开发的主流工具. 前几天写的那个拖拽,自己留下的疑问...这次在热心博友的提示下又修正了一些小小的bug,也加了拖拽的边缘

JavaScript实现可拖拽的拖动层Div实例_javascript技巧

本文实例讲述了JavaScript实现可拖拽的拖动层Div.分享给大家供大家参考.具体如下: 这是一个完美的JS拖拽效果,带拖尾的JavaScript拖动层代码,经过了多次优化修正,复制节点的方法不错,值得JS爱好者学习,同时代码修正了给拖拽元素加ondblclick事件无效的问题,兼容多种浏览器,拷贝代码即可运行使用. 运行效果如下图所示: 具体代码如下: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"

一个可拖拽列宽表格实例演示_javascript技巧

复制代码 代码如下: <DOCTYPE html> <html> <head> <title></title> <meta http-equiv="Content-Type" content="text/html;charset=utf-8"> <style> body{ font:12px/1.5 Tahoma; } #gannt_left{ width:500px; } #lef

js 表格拖拽效果实例代码 (IE only)_javascript技巧

姓名 性别 年龄 周周 F 20 达达 M 21 黄宏 M 12

javascript实现拖拽并替换网页块元素_javascript技巧

学生甲 学生乙 学生一