bir giriş jQuery

Question

jQuery hakkında

Toplam acemi sorusu kullanarak odağı aldığında sabit bir "araç ipucu" Display: Bir kaç metin kutularının içeren Formu (input type = "text") sahip

. TextBox odağı aldığında ve odağı kaybettiğinde gizlediğinde bir çeşit Tooltip görüntülemek istiyorum. İdeal olarak, araç ipucu sol veya sağ tarafta bir "konuşma" balonu olmalıdır.

Biraz araştırdım ve qTip for jQuery bulundu, ancak bir şey üzerinde gezinirken Araç Çubukları için bir Eklenti gibi görünüyor, ancak istediğim layout and positioning var. Bir metin kutusu bağlamak o

Benim saf girişimi: Bu ASP.net beri (selektör işleri i #tbMyTextbox

$(function() { 
    $("input[id$=tbMyTextbox]").qtip({ 
     content: 'My Tooltip Text' 
    }); 
}); 

kullanmıyorum

ve ben kullanmıyorum <% = tbMyTextBox.ClientID %> .aspx dosyasımda herhangi bir kod bulunamadığından, ancak bu konu dışıdır - seçicinin kendisi başka şeylerle çalışır, bu yüzden iyi olduğunu varsayalım.).

Herkes bana nasıl çalışabileceğine dair ipucu verebilir mi veya bana bunu yapan farklı bir jQuery eklentisi hakkında bilgi verebilir mi?

Teşekkürler!

Düzenleme: Teşekkürler, Etkinlik Gösterisi hile yapar!

$("input[id$=tbMyTextbox]").qtip({ 
     content: 'Test', 
     position: { 
      corner: { 
       target: 'rightMiddle', 
       tooltip: 'leftMiddle' 
      } 
     }, 
     show: { 
      when: { 
       event: 'focus' 
      } 
     }, 
     hide: { 
      when: { 
       event: 'blur' 
      } 
     } 
    }); 

Answer 1

Bir odak olay işleyicisi gösterilen olacağını display:none ile gizli bir elemanda el araç ipucu oluşturabilir.

$("input[id$=tbMyTextbox]").focus(function() { 
    $("div[id$=tooltip]").show(); 
}); 

$("input[id$=tbMyTextbox]").blur(function() { 
    $("div[id$=tooltip]").hide(); 
}); 

başka olasılık qtip içinde gösteri seçeneğini kullanıyor olabilir. Ben hiç qTip kullanmadim, bu yüzden bu tamamen benim için teorik, ama seçenekler show: { when: { event: 'focus' } } belirtmek gerekir.

http://craigsworks.com/projects/qtip/docs/reference/#show

Answer 2

$(function() { 
    $("input[id$=tbMyTextbox]").qtip({ 
     content: 'My Tooltip Text', 
     show: 'focus', 
     hide: 'blur' 
    }); 
});