この例に従っても、画像はマウスの動きに追従できません。 Ask_html/css

この例に従っても、画像はマウスの動きに追従できません。 Ask_html/css_WEB-ITnose

WBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWB

リリース： 2016-06-21 09:42:33

オリジナル

1123 人が閲覧しました

<head>    <title></title>    <script type="text/javascript">        document.onmousemove = function () {            var x = window.event.clientX;            var y = window.event.clientY;            var div1 = document.getElementById("div1");            if (!div1) {                return;            }            div1.style.left = x;            div1.style.top = y;        };    </script></head><body><div id="div1" style="position:absolute"><img src="img\fly.png" /><br />我是图片。</div></body>

ログイン後にコピー

目的は、画像がマウスの動きに追従することを認識することです。実行時に、マウスがわずかに左上に移動してから停止することがあります。どこに問題があるのかをお聞きしたいのですが。 ?ありがとうございます

ディスカッション（解決策）への返信

助けてください！！ありがとうございます

コードは chrome 上で確立されていますが、Firefox では windows.event が見つかりませんと表示されます
修正すれば、Firefox や IE6 でも使用できます。

<head>    <title></title>	<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />    <script type="text/javascript">        document.onmousemove = function (event) {			event= event|| window.event            var x = event.clientX;            var y = event.clientY;            var div1 = document.getElementById("div1");            if (!div1) {                return;            }            div1.style.left = x;            div1.style.top = y;        };    </script></head><body><div id="div1" style="position:absolute"><img src="img\fly.png" /><br />我是图片。</div> </body>

ログイン後にコピー

コードは chrome では確立されていますが、Firefox では windows.event が見つかりません
これを修正すると、Firefox や IE6 でも使用できるようになります。

JavaScript コード?123456789101112131415161718192021222324 をクリックすると、移動できず、効果が得られません。！

mootools 互換性コード、試してみてください

this.client = {				x: (event.pageX != null) ? event.pageX - win.pageXOffset : event.clientX,				y: (event.pageY != null) ? event.pageY - win.pageYOffset : event.clientY			};

ログイン後にコピー

さて、win=window;

mootools 互換性コード、試してみてください

JavaScript code?1234this.client = { ) ?event.pageX - win.pageXOffset :even.clientX, y : (event.pageY != null) ? …
こんにちは、このコードがどこで使用されているかわかりません。アドバイスをお願いします。ありがとう！！

IE9 がクラッシュしてしまい、再インストールするのが面倒なので試してみてください。

"text/javascript">
document.onmousemove = 関数 (イベント) {
イベント = window.event
var x = (event.pageX != null) ? ;
var y = (event.pageY != null) ?event.pageY - window.clientY;
var div1 = document.getElementById("div1") {
}
div1 .style.left = x;
div1.style.top = y;

;