我有一个调试器日志,我用JavaScript编写了一个我正在研究的项目.该日志基本上是<aside>HTML5中的标记,仅在需要时显示.我想玩弄能够在屏幕上移动日志的想法,因为它可能会重叠某些事情(这对我的项目来说很好).但是,我似乎无法弄清楚如何使用HTML5正确地拖放标签,以便它可以放置在屏幕上的任何位置(好吧,或在<div>元素内).
在阅读HTML5的拖放支持后,我对它的工作方式有了基本的了解,但是我不知道在允许将div放在任何地方时从哪里开始(它的z-index是一个很高的值,所以正如我所说,重叠很好).
有什么建议?
哦,我想尽可能避免在这个项目中使用外部库.我试图用纯JavaScript/HTML5来做这件事.
我画了一条连接可拖动 div 的线。但是,当 div 被拖动时,该线失去了它的源点和目标点(即从一个 div 到另一个 div)。我的目标是以这样一种方式设置线,它不应该从任何 div 中丢失它的边缘,并且无论我在何处拖动 div,它都会不断动态更新自身,即高度、旋转、位置。
抱歉英语不好。请帮忙.....!这是我的代码
var coordinates = function(element) {
element = $(element);
var top = element.position().top;
var left = element.position().left;
//--------------line------------------------------
var length = Math.sqrt(((left) * (left)) + ((top) * (top)));
var angle = Math.atan2(top, left) * 180 / Math.PI;
var transform = 'rotate(' + angle + 'deg)';
$('#results').text('X: ' + left + ' ' + 'Y: ' + top).attr('style', 'margin-left:' + left + 'px');
//$('#line1').attr('style', "margin-left:"+left+"px;margin-top:"+top+"px;height:"+(parseInt(100+top))+"px;transform:"+transform+";width:"+length+"px;");
$('#line1').attr('style', "transform:" + transform + …Run Code Online (Sandbox Code Playgroud)