Question

我打算创建一个列出某个产品（例如pc鼠标）的网站，您可以在其中设计自己的一组参数。在这种情况下，您可以更改鼠标的颜色，鼠标滚轮的设计，左右按钮等可能有不同的外观。我遇到的问题是以某种方式实现它，例如，在鼠标滚轮设计的集合中，我点击某个鼠标滚轮设计，主鼠标图像的鼠标滚轮将更改为选定的鼠标滚轮。我真的不知道怎么做（js，html5 canvas？）。任何人都可以指向某个工具或者这样做的技巧吗？我一直在谷歌搜索一段时间，但仍然没有任何关于如何做到这一点的想法。提前谢谢你，祝你有个美好的一天。

Answer 1

我认为您可能需要预先设计这些图片。假设您有鼠标图片。用户可以选择更改其颜色（红色，黄色和粉红色）。然后，你需要有另外3个鼠标的红色，黄色和白色图片。粉色。然后，使用Javascript更改图像src。例如：

function ChangeColor(myColor) {
    var pic = document.getElementById("my_pic");
    if (myColor = "red")
        pic.src = "original_red.png";
    else if (myColor == "pink")
        pic.src = "original_pink.png";
    else 
        pic.src = "original_yellow.png";
}

HTML

<img id="my_pic" src="original.png" alt=""><br><br><br>
<button onclick="ChangeColor('\'red\'');">Red</button>
<button onclick="ChangeColor('\'pink\'');">Pink</button>
<button onclick="ChangeColor('\'yellow\'');">Yellow</button>

这就是你想要的吗？

如何从小图像创建一个大图像，并使用JavaScript动态更改它们

1 个答案: