0

ユーザーがクリックしたカーソルの位置を特定したい。

そして、ユーザーがクリックしたページの下部に 1 つの div を表示します。

たとえば、誰かがロゴをクリックすると、スタック オーバー フローのホームページが表示されます。

次に、ロゴの下部に div を表示する必要があります。

同様に、下部のリンクをクリックすると、その div がページの下部に表示されます。

JS フレームワークとして mootools を使用しています。しかし、どの JavaScript コードも役に立ちます。

これがすべての人に明らかであることを願っています。

よろしく
お願いします

4

2 に答える 2

1 
<head>
</script>        
function mouseX(evt) 
{
    if (evt.pageX) return evt.pageX;
    else if (evt.clientX)
        return evt.clientX + (document.documentElement.scrollLeft ? document.documentElement.scrollLeft : document.body.scrollLeft);
    else return null;
}
function mouseY(evt) 
{
    if (evt.pageY) return evt.pageY;
    else if (evt.clientY)
        return evt.clientY + (document.documentElement.scrollTop ? document.documentElement.scrollTop :  document.body.scrollTop);
    else return null;
}
function clicked(evt)
{
    if(typeof evt == 'undefined')
    evt = window.event;
    alert("X = "+ mouseX(evt) + " Y= " + mouseY(evt);

}
</script></head>
<body onclick="clicked()"></body>

単純に を使用できますwindow.event.x, window.event.yが、これは位置を取得するためのより安定した信頼できる方法です..

[アラートの代わりに、divElement.style.left , divElement.style.top..を変更します.divのposition（スタイルで）がabsolute. ]

于 2010-03-30T10:19:05.787 に答える
0

プロトタイプを使用するのは非常に簡単です。

document.observe('click', function(e) {
    $('YourDivId').setStyle({
        'left': e.clientX, 
        'top': e.clientY
    }).show();
});

あとは、「display: none」と「position: absolute;」を使用して body に html DIV を作成するだけです。そして欲しい内容。

于 2010-03-30T11:06:01.873 に答える