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

标签 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

最佳答案

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;
});

关于css - 苹果浏览器。拖动时光标错误,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/47295211/

上一篇:css - 当前页面用户所在的突出显示菜单项

下一篇:javascript - 按钮闪烁,隐藏在 Safari 中

相关文章:

html - 内联文本区域样式以覆盖 CSS 默认值

html - 你能为 svg "background-image"制作动画吗?

css - 为什么 "font"会忽略 CSS 中的 "line-height"而 "font-size"不会?

html - 左右对齐div

javascript - 在拖放时获取 jstree 的元素 ID

css - Safari 5.1 将边距/填充推出超过 50+ 像素

css - 伪背景叠加文本之前和之后

javascript - 在 iOS 上的 Safari 中,是否可以有一个将文本复制到剪贴板的按钮?

javascript - 将 Kendo Web Draggable 绑定(bind)到动态生成的 div

javascript - 多次触发拖放事件