我目前正在创建一个网站构建器，以便用户可以将元素拖放到页面上并调整元素大小和修改颜色等。
我想知道它是否可以通过 HTML5 画布完成，以便可以拖动事件等，然后当用户对画布中的这个视图感到满意时，我可以以某种方式将此画布绘图转换为 HTML 和 CSS。这可能吗？
如果有怎么办？任何人都可以指出我的任何例子吗？或者有什么更好的方法？
问问题
6129 次
2 回答
3
通常，当您发现为线框等执行此操作的应用程序时，它们不会生成非常有用的 HTML。但不确定您的确切意图：
1 使用画布：
查看http://www.kineticjs.com/为您在画布上绘制的元素添加事件、调整大小和移动元素。虽然将画布转换为 html 并不是一件容易的事，事实上，我假设你几乎会以第 2 点结束。
2 使用普通的 html/css/js：
您将 position: absolute 添加到每个元素，这样所有东西都可以拖动，您可以指定 z-index 来指定它是否显示在另一个元素的上方或下方。您可以很容易地复制 HTML，因为它只是复制当前源。但是，如果这应该被用作生成体面的html 的一种方式，那么有人会在他们的网站上实际使用它，而不仅仅是作为线框/模型，那么这种方法不会很好。
我无法想象这样一种情况，您可以纯粹使用设计器来制作可维护且整洁的 HTML。
于 2012-08-21T21:47:56.410 回答
2
我的项目http://canvimation.github.com/在某种程度上可以做你想做的事。
我的项目的源代码位于https://github.com/canvimation/canvimation.github.com
master 分支是当前的工作代码。我目前正在重新编写项目，以使代码更易于理解，调试一些元素并使动画构建更容易。新开发在 stage1 分支上，但还不能在线运行，您必须复制代码才能运行它。欢迎您使用代码或 fork 项目。
于 2012-08-22T08:02:23.257 回答