博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
jquery拖拽实现UI设计组件
阅读量:5023 次
发布时间:2019-06-12

本文共 514 字,大约阅读时间需要 1 分钟。

想做一个UI设计的组件,左侧是控件列表,右边是编辑区域,左侧的控件可以重复拖拽到右侧然后进行编辑。

效果草图:

部分js代码:

function domop(){        //set drag and drop				$( "#compls .component" ).each(			function(){$(this).draggable({			helper:"clone"			//revert: 'invalid',			//appendTo:"#rightcolumn"			});}		);		$("#rightcolumn").droppable({			//accept:"#compls .component",			drop: function( event, ui ) {        			  $(this).append($(ui.draggable).clone());			}		});    }

剩下的后面慢慢完善,先记录下。

  

转载于:https://www.cnblogs.com/wancy86/archive/2013/04/10/draggable_editor.html

你可能感兴趣的文章
为什么JS动态生成的input标签在后台有时候没法获取到
查看>>
20189210 移动开发平台第六周作业
查看>>
java之hibernate之基于外键的双向一对一关联映射
查看>>
rxjs一句话描述一个操作符(1)
查看>>
第一次独立上手多线程高并发的项目的心路历程
查看>>
ServiceStack 介绍
查看>>
Centos7下载和安装教程
查看>>
无谓的通宵加班之后的思索
查看>>
S1的小成果:MyKTV系统
查看>>
从setting文件导包
查看>>
编写一个函数isMerge,判断一个字符串str是否可以由其他两个字符串part1和part2“组合”而成...
查看>>
union和union all
查看>>
Github 开源:使用控制器操作 WinForm/WPF 控件( Sheng.Winform.Controls.Controller)
查看>>
PMD使用提醒
查看>>
Codeforces 887D Ratings and Reality Shows
查看>>
论文《A Generative Entity-Mention Model for Linking Entities with Knowledge Base》
查看>>
CentOS 6.7编译安装PHP 5.6
查看>>
Linux记录-salt分析
查看>>
Android Studio默认快捷键
查看>>
发布开源库到JCenter所遇到的一些问题记录
查看>>