苹果浏览器。拖动时光标错误

时间:2017-11-14 21:07:36

标签: css safari drag-and-drop cross-browser cursor

我尝试在项目中添加拖放功能,并使用slip.js进行此操作。

要装饰光标我已将class="draggable"添加到每个可拖动的<tr>。这个类的CSS是:

.draggable:active { 
  cursor: -webkit-grabbing;
  cursor:    -moz-grabbing;
  cursor:         grabbing;
}

拖放工作正常,但在Safari中,当我拖动表格行时,光标看起来像cursor: text text cursor

在Chrome中,光标正常grabbing cursor

有趣的是,当我点击并按住而不拖动光标时,在Safari中也可以grabbing cursor

1 个答案:

答案 0 :(得分:0)

chrome sets cursor to text while dragging, why?中所述,我需要在拖动时禁用选择。我的JavaScript:

list = document.getElementById('demo1');

var flag_dragging = false;
list.addEventListener('mouseover', function(e){
  document.onselectstart = function(){ return false; }
});

list.addEventListener('mouseout', function(e){
  if(!flag_dragging){
    document.onselectstart = function(){ return true; }
  }
});

list.addEventListener('dragstart', function(e){
  flag_dragging = true;
});

list.addEventListener('dragstop', function(e){
  flag_dragging = false;
});