jQuery-如何使div在其中心內跟隨光標

Question

這就是我得到的。

 <div class="box"></div>

---

 .box {
 position: absolute;
 left: 0;
 top: 0;
 width: 100px;
 height: 100px;
 background: yellow;
 }

---

 $(document).bind('mousemove', function(e){
 $('.box').css({
 top: e.pageY
 left:  e.pageX,
 });
 });

有用。 該框跟隨光標。 問題是它跟隨光標的邊緣。 即，光標保持在框的左上角。 我希望它保持盒子的中心，或者不是邊緣的另一點。 任何想法如何做到這一點？

對不起，這個傻瓜。 我對HTML / CSS足夠好，但僅從javascript和jQuery開始。

Answer 1

改用此代碼

 $(document).bind('mousemove', function(e){
   $('.box').css({
     top: e.pageY - $(".box").height()/2, // just minus by half the height
     left:  e.pageX - $(".box").width()/2 // just minus by half the width
   });
 });