2

これは一般的な JavaScript の質問かもしれませんが、私は頭がおかしくなりました。mousemove イベントで pageX と pageY を検出し、それらを css グラデーションに割り当てる関数があります。

$(function(){
    var mouseX = 0, mouseY = 0;
    $(document).mousemove(function(e){
        mouseX = e.pageX;
        mouseY = e.pageY; 
    });

    // cache the selector
    var follower = $("#follower");
    var xp = 0, yp = 0;
    var loop = setInterval(function(){
        // change 12 to alter damping higher is slower
        xp += (mouseX - xp) / 12;
        yp += (mouseY - yp) / 12;
        follower.css({
            background : '-webkit-radial-gradient('+xp+' '+yp+', ellipse cover,  rgba(12,47,63,0) 0%,rgba(10,37,49,1) 27%,rgba(5,10,10,1) 100%)'
        });

    }, 30);
}); 

本当に私を夢中にさせているのは、それがjsbinで動作することです:

http://jsbin.com/owuxep/3/edit

しかし、私のサーバー(またはデスクトップでさえ)ではありません。どんな助けでも大歓迎です。

http://paulclarkphoto.com/mouseFollow/``

4

2 に答える 2

0

ページにスクリプトをどのように含めますか? JavaScript が実行されたときに、「#follower」要素がまだ DOM に存在していない可能性があります。要素が定義された後、または DOM が読み込まれた後にスクリプトを含めてみてください (つまり、jQuery: を使用します$(document).ready(HERE_SOMEHOW)) 。

于 2013-04-02T19:55:12.937 に答える