技術標籤：web前端javascript

為了完善我利用canvas製作的加速球效果，實現拖動後改變加速球內部的字型顏色。
html部分:
這裡使用一個div為了使效果更加清晰，
給input添加了一個滑鼠移動事件。

<div id="box"></div>
<input type="range"id="color" value="0" min="0" max="225" οnmοusemοve="get()">

這裡是div的樣式：

div {
            width: 100px;
            height: 100px;
            background: rgb(11, 0, 202);
        }

下面是js部分，獲取input的value值，通過js改變div的css樣式，rgb的可以按個人意願更改。

function get() {
     		var num = document.getElementById("color").value;
            var box = document.getElementById("box"
 
);

            console.log(num);//列印滑塊的value值

            box.style.background = "rgb(11, "+ num +", 202)";
        }

效果如下

（感謝觀看，希望能幫到你）