4

画像を中に入れてdiv要素を作成し、マウスの位置からの座標で位置を変更したい。3D効果を作成するためのjquery-pluingsがいくつかありますが、X座標とY座標を移動するだけで済みます。また、div要素の制限でそれを行います。

次のコードを取得しました:

$('div.images').mousemove(function(e){
        var x = e.pageX - this.offsetLeft;
        var y = e.pageY - this.offsetTop;
        $('div.images').css({'top': x,'left': y}); 
    });

CSSでは、div.imagesには絶対位置があります。マウスを動かしても位置は変わりませんが、CSSで位置を削除すると、要素のスタイルに変更が適用されますが、位置は変更されません。

私に何をする必要があるかアドバイスをください。

http://fieroanimals.com/で、Flashで実現しましたが、JQueryで実現したいと思います。

4

2 に答える 2

6
$(document).ready(function(){
      $('div.moveAble-container').mousemove(function(e){
            var y = e.pageY;
            var x = e.pageX;                    
            $('div.moveAble').css({'top': y}); 
            $('div.moveAble').css({'left': x});

      });
    });
于 2013-10-11T13:11:59.620 に答える
3

$('div.images').mousemove(...)は、 の上にあるマウスの動きのみを検出することを意味しdiv.imagesます。

$('html')ページ全体でのマウスの動きを検出します。

jsFiddle の例

必要に応じて、X 座標を CSSleftプロパティに適用し、Y 座標を CSSに適用することもできますtop。(あなたの質問では逆です)。

于 2012-06-28T12:23:03.510 に答える