Javascript 如何根据鼠标位置更改背景颜色（特定颜色）

代码如下：

var $win = $(window),
    w = 0,h = 0,
    rgb = [],
    getWidth = function() {
        w = $win.width();
        h = $win.height();
    };

$win.resize(getWidth).mousemove(function(e) {

    rgb = [
        Math.round(e.pageX/w * 255),
        Math.round(e.pageY/h * 255),
        150
    ];

    $(document.body).css('background','rgb('+rgb.join(',')+')');
    //top center: rgb(85, 209, 79)
    //right middle: rgb(104, 129, 197)
    //bottom center: rgb(40,129,255)
    //left middle: rgb(255, 184, 0)
    //very center: rgb(15, 175, 168)
}).resize();

我想根据鼠标位置更改背景颜色，但我不知道如何指定5个点（顶部、右侧、底部、左侧、中心）的颜色

所以这五个点，我有颜色，当我在这五个点之间移动鼠标时，我想把它从一个点改变到另一个点。

---

您必须使用插值方法。很受欢迎

我要做的是在感兴趣的点（顶部、左侧、右侧、底部和中心）指定颜色。然后通过定义的最近颜色的平均值来定义角点的颜色（这不是很好，最好也指定它们）

一旦完成，给定屏幕上的一个点，我将计算该点所在的子正方形，并计算该正方形顶点之间的双线性插值（如图所示）

这是一把小提琴：

var$win=$（窗口），
w=0，
h=0，
rgb=[]，
getWidth=function（）{
w=$win.width（）；
h=$win.height（）；
};
var平均值=函数（a，b）{
返回[0.5*（a[0]+b[0]）、0.5*（a[1]+b[1]）、0.5*（a[1]+b[1]）；
}
变量中心=[255，255，255]；//白色
var topmidle=[0,0,0]；//黑色
var leftMiddle=[255,0,0]；//红色
var rightmidle=[0,255,0]；//绿色
变量bottomMiddle=[0,0255]；//蓝色
var topLeft=平均值（leftMiddle，topMiddle）；
var topRight=平均值（topMiddle，rightMiddle）；
var bottomLeft=平均值（leftMiddle，bottomMiddle）；
var bottomRight=平均值（bottomMiddle，rightMiddle）；
var插值2d=函数（x00，x01，x10，x11，x，y）{
返回x00*（1-x）*（1-y）+x10*x*（1-y）+x01*（1-x）*y+x11*x*y；
}
var InterpolatorArray=函数（x00，x01，x10，x11，x，y）{
var结果=[0,0,0]；
对于（变量i=0；i<3；++i）{
结果[i]=数学下限（插值2d（x00[i]，x01[i]，x10[i]，x11[i]，x，y））；
}
返回结果；
}
$win.resize（getWidth）.mousemove（函数（e）{
var位置X=e.pageX/w；
变量位置y=e.pageY/h；
变量x00，x01，x11，x10；
如果（位置X>0.5和位置Y>0.5）{
x00=中心；
x01=底部中间；
x10=右中；
x11=右下角；
位置X=2.0*（位置X-0.5）；//将位置缩放回[0,1]
位置Y=2.0*（位置Y-0.5）；
}如果（positionX>0.5&&positionY天哪！你刚刚写了它！非常感谢！非常欢迎。这很有趣，现在可以将很多问题标记为与此相同的问题：）Hi@Regis Portalez。我想知道你是否可以帮我解决另一个类似的问题。我在这页上有4个元素（上、右、下、左）居中。所有元素的不透明度均为0。我希望使其可见/隐藏取决于鼠标位置。例如，当鼠标位于（miidleTop，topRight）部分时，当鼠标位于（中、右）部分时，顶部元素开始可见部分，右箭头开始可见，顶部箭头隐藏。不透明度值取决于鼠标位置。你认为可能吗？看起来我可以用positionX和positionY值管理，如下所示：
$（'.nav.top'）.css（'opacity'，positionX）；
###################
#        O        #
#                 #
#                 #
# O      O      O #
#                 #
#                 #
#        O        #
###################