gpt4 book ai didi

jquery - 创建调色板

转载 作者:行者123 更新时间:2023-11-28 05:11:14 25 4
gpt4 key购买 nike

我正在创建一个基于网络的 GUI 编辑器。在这样做的同时,我需要创建一个颜色选择器的前端,例如附图中的那个。我需要知道我应该如何去创建它。由于我是这种开发的新手,我可以想到以下选项..1. 创建 span 并使它们可点击并赋予它们背景颜色。2.使用一些生成此功能的插件3. 使用一系列按钮,每个按钮都有独特的颜色。

我还需要知道是否有生成此功能的任何在线工具或 jquery 插件。任何帮助将不胜感激

最佳答案

我过去写过类似的东西,这里有一个简单的例子说明了你可以这样做的一种方法:

<!DOCTYPE html>

<html lang="en">

<head>
<style type="text/css">
.colorBox {
position: relative;
float: left;

width: 24px;
height: 24px;

margin: 6px;
padding: 0;

background: #FFFFFF;
border: solid 1px #000000;
}

colorPicker {
background: #DCDCDC;
border: solid 1px #000000;
}
</style>

<title>
Page
</title>

<script src="plugins/js/jquery-1.11.0.js">
</script>

</head>

<body>

<div id="colorPicker" class="colorPicker">
<div id="color-red" class="colorBox" style="background: red;">
&nbsp;
</div>
<div id="color-green" class="colorBox" style="background: green;">
&nbsp;
</div>
<div id="color-blue" class="colorBox" style="background: blue;">
&nbsp;
</div>
</div>

<div id="targetBox" class="colorBox">
&nbsp;
</div>

<script>
$(document).ready(function() {
$(".colorBox").on("click", function() {
var strID = $(this).attr("id");

$("#targetBox").css("backgroundColor", $("#" + strID).css("backgroundColor"));
});
});
</script>

</body>

<html>

只需监听特定元素上的 click 事件并返回被点击元素的背景颜色。

希望这对您有所帮助。

预计到达时间 - 不确定您可以使用的任何库或插件,但肯定会有一个。但是构建一些东西并不太难。

关于jquery - 创建调色板,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/39545467/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com