-2

また、わかりやすくするために添付の画像をご覧ください。jqueryまたはjavascript、あるいはその両方を使用して、そのdivコンテナー内のどこかに位置を見つけたいdivコンテナーがあります。添付の画像はすべてを示しています。助けてください。

アップデート

この位置を見つけたいのは、そのポイントに向かってコンテナをアニメートして、最終的には消えたいからです。次に、反対側の位置も見つけて、その位置からコンテナをアニメートできるようにします。

2回目の更新

言い換えれば、2本の線の交点をどのように見つけることができますか？

ここに画像の説明を入力してください

4

4 に答える 4

1

div 内の 2 つの線の交点を見つける必要がある場合、マークアップは次のようになります。

<div id="container" style="position:absolute; width: 100%; height: 200px;">
  <div style="width: 2px; height: 100%; left: 20%; position:absolute; background-color: red; top: 0;"></div>
  <div style="height: 2px; width: 100%; left: 0; position:absolute; background-color: blue; top: 25%;"></div>
</div>​

jQuery を使用すると、次のように交差点の座標を見つけることができます。

var x = $('#container div:first').position().left;
var y = $('#container div:last').position().top;
console.log(x,y);

x と y は、コンテナー要素に対するピクセル単位の座標になります。

http://jsfiddle.net/sAsmj/

于 2012-09-11T12:20:02.207 に答える
0

画像が表示されませんが、理想的にはキャレット位置である位置を取得する場合は、jquery プラグインhttp://plugins.jquery.com/project/jCaretを使用できます

于 2012-09-11T11:50:10.387 に答える
0

マウスの X、Y が必要な場合は、この質問を読むことができます。

jQueryを使用して画像をマウスでクリックしたときのX/Y座標を取得する

に基づく質問からの抜粋を次に示しimgますが、コンテナに合わせて変更できます。

$(document).ready(function() {
  $('img').click(function(e) {
    var offset = $(this).offset();
    alert(e.clientX - offset.left);
    alert(e.clientY - offset.top);
  });
});
于 2012-09-11T11:51:43.040 に答える
0

これを使ってポインタの位置を見つけることができます、試してみてください

$(document).ready(function(){

    $("div#container").on("mousemove", function(e){
    var self = $(this);
    var dx = e.pageX;
    var dy = e.pageY;

    var x = dx - self.offset().left ;
    var y = dy - self.offset().top ;

    console.log(x);
    console.log(y);
    });
});
于 2012-09-11T11:55:27.403 に答える