Question

我需要在Chrome中更改滚动条的自定义光标。我有灯箱，它设置了自定义光标与大X和关闭文本。问题是在chrome中，光标定义也会被滚动条继承，这看起来有点滑稽。

见小提琴：

<div class="below">
    <div class="full">
         <div class="scrollable">long text</div>
    </div>
</div>

CSS：

.full{
    position:fixed;
    background:red;
    height:100%;
    width:80%;
    overflow-y:scroll;
    cursor: url('cursor.cur'),not-allowed;
}
.scrollable{
    padding:1em;
    background:white;
    position:relative;
    display:block;
    width:80%;
    margin:50px auto;
}

http://jsfiddle.net/3fY9r/1/

有没有办法如何仅触发滚动条并将外观更改回默认光标？

Answer 1

您可以使用chrome的滚动条的供应商选择器来设置样式。但是，我不认为它会允许您更改光标。您可以尝试这样做以查看它是否有效：

::-webkit-scrollbar {
    cursor:pointer;
}

<强>更新

在详细查看此问题后，显然Chrome存在错误并且滚动条上的光标会更新。这是the ticket，它仍然是开放的。您仍然可以更改样式，但自定义似乎有点受限。

Answer 2

尝试将cursor: auto添加到可滚动类中

.scrollable { 
  cursor: auto; 
}

适用于textareas，不确定适用于divs。

在chrome中更改滚动条上的光标图像

2 个答案: