2012-01-20 20 views
9

Chrome'da (Win 7 üzerinde 16.0.912.75 m sürümünü kullanıyorum) Sol fare tuşunu basılı tuttuğum anda, imleç ne olursa olsun, imleç daha sonra imleç türü text olarak değiştirilir (sayfada herhangi bir metin olmadığında bile).Chrome hatası mı? İmleç, fareyi aşağıya taşır + hareket ettir

Bu bir hata mı? Sürükle ve bırak aracımın biraz aptalca görünmesini sağlarken etrafta nasıl dolaşacağını bilen var mı?

JSFiddle: http://jsfiddle.net/KJfbs/

Düzenleme

hiçbir metin varken sorunu çözecektir -webkit-user-select: none; ekleyerek aşağıda @davgothic tarafından cevap olarak. Ancak, elemanı kesinlikle konumlandırmalı ve arkasındaki metni yerleştirmeliyiz, sonra sorun devam eder.

JSFiddle: http://jsfiddle.net/KJfbs/2/

cevap

10

deneyin metin seçimini engellemek için bu öğenin CSS -webkit-user-select: none; ekledi.

Örnek:

http://jsfiddle.net/KJfbs/1/ Şahsen ben de eklersiniz bu ...

-webkit-user-select: none; 
-khtml-user-select: none; 
    -moz-user-select: none; 
    -ms-user-select: none; 
    -o-user-select: none; 
     user-select: none; 

... çapraz tarayıcı uyumluluğu için.

+1

+1 - teşekkürler, benim söz konusu örneğin çalışır. Ne yazık ki, div kesinlikle metnin üzerine yerleştirildiğinde bu işe yaramaz. Bunun neden olabileceği hakkında bir fikrin var mı? –

+0

Gerçekten emin değilim, son çare olarak -webkit-user-select: none; 'metnini içeren öğeye ayarlayabilirsiniz. Kullanıcı bu metni seçme yeteneğini kaybeder. [İşte bir örnek] (http://jsfiddle.net/KJfbs/3/). –

+0

Evet, sanırım bu bir seçenek. Teşekkürler - Cevabınızı kabul etmeden önce herhangi birinin önerim hakkında tavsiyelerde bulunup bulunamayacağını görmek için sabırsızlanıyorum. –

0

-webkit-user-select ile şunu düşünüyorum: yok; Sayfada başka bir şey koyarsanız sorun devam eder. Örneğin:

http://jsfiddle.net/KJfbs/237/ Neyse ben jQuery preventDefault her durumda sorunu çözer düşünüyorum: http://jsfiddle.net/KJfbs/241/

preventDefault imleç metne değişimdir varsayılan davranışı önler.
Sonra istediğim imleci kontrol edebilir ve koyabilirim: $ (this) .css ("imleç", "wait");

JQUERY:

$(function(){ 
    $('#lime').mousedown(function(e) { 
     e.preventDefault(); 
     $(this).css("cursor","wait"); 
    }).on('mouseup mouseleave', function() { 
     $(this).css("cursor","default"); 
    }); 
}); 

HTML:

<div id="lime"></div> 
<p>Lorem ipsum dolor sit amet</p> 

CSS:

#lime { 
    background-color: lime; 
    height: 100px; width: 300px; 
    cursor: wait; 
    position: absolute; 
    top: 0; left: 0; 
} 
İlgili konular