我找到了很多关于我的问题的资源,但我只是希望获得基于对我正在尝试做的事情的高度概述的意见。
基本上,我结合使用 Javascript 和 HTML 为 friend 的网站构建定制程序。我应该首先说我有一些 HTML 经验,但这是我第一次使用 Javascript(我有 Java 经验)。最终目标将类似于定制器,允许用户选择自行车的部件并更改它们的颜色以下定制订单。
我有自行车的各个部分作为图像文件,我正在使用这个 jscolor 颜色选择器,可以在以下位置找到:http://jscolor.com/examples/#example-showing-hiding允许用户从颜色图中选择一种颜色。我的计划是将给定的部分(照片)叠加在同一张照片的副本之上,并只填充其中一个,就像在 Photoshop 中分层一样。这样,零件就会填充正确的形状,而不是填充为图像文件的整个正方形。随着光标移动,颜色应实时变化。完成后,他们可以保存零件,颜色记录将保存在后端。
由于我是 Javascript 的新手并且没有 HTML 经验,所以我发现要让它走上正轨有点挑战。所以我希望从一些有 HTML/Javascript/CSS 经验的人那里得到一些建议,为我指明正确的方向,使它比目前更好地发展。我不确定如何“表述”我想做的事情。
我要解决的三个主要部分:
使用 HTML 按钮加载不同的自行车部件(本质上是加载单独的图像文件)。
将 jscolor picker 中的颜色添加到所选部分的图像。
在用户单击“保存”按钮时保存部件的状态。
我会继续搜索论坛,因为我已经看到了一些与我想做的类似的线索,但我主要想知道我的方法对我尝试做的事情是否可行。
提前致谢!
最佳答案
使用普通的 HTML 按钮会使事情变得复杂。 我认为利用 HTML5 Canvas API 是解决此问题的更好方法。 Canvas 是 HTML5 元素,可帮助您使用 JavaScript 进行图形操作。了解有关 Canvas 的更多信息 here . 您可以使用诸如 Fabric.js 之类的库让事情变得更容易。
关于javascript - 设计颜色定制器,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/36466919/