2

私はこのコードを使用しています:

$('.my_img').mousemove(function(e){
   $('.mycls').css("left",e.pageX-20+"px");
   $('.mycls').css("top",e.pageY-10+"px");

});

それから...

<div class="mycls">I Move</div>

それから...

<img class="my_img" src="myimg.png" />

私の問題は、これらの div の上に div を追加すると、位置が変わり、mycls がマウスの位置になくなることです。

したがって、次のように本体の後に余分な div を追加するとします。

<div>ONE</div>

<div>TWO</div>

...その後、コードの残りの部分...位置が失われます:o/

これを並べ替える方法についてのアイデアはありますか?

4

3 に答える 3

1

e.pageXとe.pageYの値はページ全体に対して相対的であるため、新しい要素を追加してもコードが影響を受けることはありません。要素に上を設定すると、ページの上と左からの距離が定義されます。

これが問題になる唯一のケースは、 mycls divの親要素にposition:relativeを設定した場合です。そのposition:relativeを削除して、topleftが親要素ではなくページ全体を参照するようにします。

于 2012-06-26T13:51:00.050 に答える
1

position:absolute;可動要素にCSSを追加するだけです.mycls

于 2012-06-26T13:30:45.807 に答える