Fare işaretçinizi jquery ile nasıl görüntüleyebilirsiniz?

Question

Sürükle ve bırak işlemini zor buluyorum (hareket ederken fare düğmesini basılı tutuyorsunuz) ve bir kullanıcının bir simgeyi tıklatıp çizim tablasında tekrar tıklattığı bir "seç ve bırak" seçeneği sunmak istiyorum karşılık gelen eleman (bir resim).

Bunu jquery ile nasıl yapıyorsunuz?

Teşekkürler.

Düzenleme: Öğeleri seçmek için iki div, bir simge plakası ve resimlerin bırakıldığı bir çizim plakam var. Fare, çizim plakasına girdiğinde, daha büyük görüntünün% 50 opaklığını istiyorum, böylece fare işaretçisini takip eder, böylece kullanıcı nerede düşeceğini tıklayarak bilir ve eğer çizim tahtasında bir şeyle çakışırsa.

Answer 1

cevabı:

HTML

<div id="sketch"></div> 
    <img src="cat.jpg" class="follow" style="position: absolute;"/> 

JQuery

$("#sketch").mousemove(function(e){ 
     $('.follow').css({'top': e.clientY - 20, 'left': e.clientX - 20}); 
}); 

Jsbin demo here.

Answer 2

Öğeyi, yalnızca click olayı için erişilebilir olan bir değişkende saklayın.

Yani, her görüntü üzerinde bir onclick: $('img').bind('click', function(e) { ... }); Ardından, tıklattıklarında, targetEvent'i bir yere saklayın ve bir tıklama olayını çizim plakasına bağlayın.

İlginç bir yöntem, bir kapatma kullanmak ve bu belirli targetEvent öğesini bağlamak olacaktır; böylece, çizim plakasına bir tıklama yapılması durumunda, hangisini kullanacağınızı bileceksiniz, ancak bildiğiniz sürece, o zaman sadece img'i yeni konuma taşımak için bir animasyon kullanın.

Unutmuyorum ki, bir resim tıklandığında, yeni bir tane bağlamadan önce, çizim plakasında bulunan olay işleyicisinin kaldırıldığından emin olmanız gerekir. (James Black'in yardım kullanarak)