3

マウスポインターでクリックした場所に小さなドットを印刷するこの簡単なコードを書きました:-

$(document).ready(function(){
    $('#pane').click(function(e){
        var pixel = $('<div />')
                  .addClass('pixel')
                  .css({
                      top: e.clientY,
                      left: e.clientX
                  });

        $('#pane').append(pixel)
    });
});

私が作成したこのフィドルを参照してください。長方形の内側をクリックすると、その場所に小さなドットが印刷されます。しかし問題は、マウス ポインターがtipあった場所にドットが印刷されないことです。下の画像を見て、私が何を意味したかを確認してください:-

別の場所にドットが印刷されているスクリーンショット

Firefox と Chrome の両方で試しました。

4

2 に答える 2

1

あなたのコードは正しく動作しています。

ページをズームして確認してください。

理解を深めるために、ピクセルの高さと幅を 2px から 3px に変更しました。e.clientX -1 と e.clientY -1 の位置から描画するので、正確に中央に見えます。

フィドルを見つけることができます

于 2012-10-16T10:20:55.457 に答える