JQuery UI Seçilebilir eklenti: Div overflow'ları seçildiğinde kaydırma çubuğunu seçilemez yapın

Question

overflow: auto; olarak ayarlanmış bir div var. Bu divın bu içeriği seçilebilir (jQuery UI kullanılarak).

Div taşması ve kaydırma çubuğu belirdiğinde, kaydırma çubuğu kendiliğinden seçilebilir, böylece kaydırma işlemi iyi sonuç vermez. FF/Chrome’da div’ı kaydırabilirim ama seçilebilir anahatlarım var. Safari'de, tıklama seçilebilir işleyici tarafından alındığından, kaydırma çubuğu hiç kapanmaz.

Kaydırma çubuğunu 'iptal' öğeleri listesine eklemek için kullanabileceğim bir seçici var mı? Ya da kaydırma çubuğunun seçilebilir olmasını engellemenin başka bir yolu var mı? İşte

benim seçilebilir div yapılandırılması ediyorum nasıl bir kod parçacığı var: İdeal

<div class="mySelectable"> <!-- set to auto overflow --> 
    <div class="myButton">I can't be selected</div> 
    <div class="rowSelectable">I am a selectable row</div> 
    ... 
</div> 

, ben ekleyebileceğiniz bir şey arıyorum: gibi

$(".mySelectable").selectable({ 
    cancel: '.myButton, .notSelectable', 
    filter: '.rowSelectable', 
    selecting: function(event, ui){ 
     handleSelection(ui.selecting); 
    }, 
    selected: function(event, ui) { 
     handleSelected(ui.selected); 
    }, 
    unselected: function(event, ui) { 
     handleUnselected(ui.unselected); 
    } 
}); 

Benim HTML görünüyor Kaydırma çubuğunu atlamanıza yardımcı olan 'iptal' seçeneği.

Answer 1

D'oh! Çözüm basitti - başka bir div ekle ve taşma setine sahip değil. Yani, html olur: Eğer `div` içinde var ve nasıl` focus` eylemleri alıyoruz bağlıdır

<div class="wrapperDiv"> <!-- set to auto overflow --> 
     <div class="mySelectable"> <!-- NOT set to overflow --> 
      <div class="myButton">I can't be selected</div> 
      <div class="rowSelectable">I am a selectable row</div> 
      ... 
     </div> 
    </div>