jquery - HSL モードでのマウスオーバーの色の変化

Question

マウスオーバーで背景色を変更する別のスレッドでこのコードを見つけました：

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(',')+')');

}).resize();

これを非常に簡単な方法で HSL モードに変換することは可能ですか?

Answer 1

もちろん。明度 (HSL の L) を手動で定義するだけで済みます。これは、例で青を処理する方法に匹敵します。

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

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

    hsl = [
        Math.round(e.pageX/w * 360),
        Math.round(e.pageY/h * 100) + "%",
        50 + "%"
    ];

    $(document.body).css('background','hsl('+hsl.join(',')+')');

}).resize();