在2個浮動div之間創建一條線並調整以適應移動

Question

我有兩個浮動div，用戶可以使用拖放將其重新放置。 我想在兩個div之間畫一條線，並使其自身（大小和位置）適應div的運動。

目的是在瀏覽器中獲得某種類似於圖表流/圖表的構造。

最好的方法是什么？

Answer 1

如果你打算做任何事情不是很基本的繪圖/數字更多，那么我會建議繪制庫如RaphaelJS。 它為您大大簡化了事情。 查看示例： http : //jsfiddle.net/sveinatle/RVykE/1/

該示例並不是一個完美的實現，但它顯示了您從Raphael獲得了多少幫助。

Answer 2

JS Plumb：

http://jsplumb.org/jquery/demo.html

SVG，畫布或VML

jQuery，Mootools或YUI

Answer 3

這是僅使用HTML，jQuery和一些三角函數的版本！
仍然需要一些調整，但大部分都在那兒。

http://jsfiddle.net/gKj35/2/

Answer 4

我可以想到三種方式：

1. 你可以使用svg
2. 您可以使用html canvas
3. 您可以使用純html（高度= 1的div是水平線，而寬度= 1的div是垂直線）。 您可以組合這些線來創建線段。