javascript - 使用 html5 和 jQuery 绘制按钮图

Question

我想将桌面应用程序迁移到网络库。其中有如下图所示的按钮图。

所有按钮都不可拖动。我只是想用线连接它们。这可能是一个愚蠢的问题。但我是网络开发的新手。我读到一些建议，我可以使用 html canvas 或使用 js 库。但是，我不知道如何或从哪里开始。或者仅使用 html5 和 jquery 而不使用任何插件就可以实现这一点吗？
或者甚至是纯 html5？请帮忙。

Answer 1

此问题有两种解决方案:

1. 您必须使用按钮标签和 html5 Canvas 绘制整个结构，或者

2. 只需制作一个 div，将图像(已经具有结构)放置在其背景中，并将按钮标签绝对定位在您想要的位置。

我会推荐第二种解决方案，它是快速修复。下面我举一个例子供引用

		div{
			background: url(/image/Bw9Zj.jpg) no-repeat;
			height: 300px;
			width: 800px;
		}
		button {
		    position: absolute;
		    top: 57px;
		    left: 306px;
		    width: 161px;
		    height: 29px;
		}

	<div></div>
	<button>Switch the kenator</button>