css - 鼠标悬停在文本区域滚动条上会提供文本光标而不是默认光标

Question

我有一个带滚动条的文本区域。我知道它可能只适用于 webkit 浏览器，这很好。

我添加了 hover 但它没有按预期工作。背景变成红色，这意味着悬停有效，但 cursor 没有改变。

是我做错了什么还是 Chrome 没有完全实现它？

确保单击“运行代码片段”以查看演示，或转到此处:https://jsfiddle.net/k4dm6pgL/

textarea {
  height: 150px;
  width: 500px;
}

textarea::-webkit-scrollbar {
  background-color: #fff;
  width: 16px;
}

textarea::-webkit-scrollbar-track {
  background-color: #fff;
}

textarea::-webkit-scrollbar-track:hover {
  background: red;
  cursor: pointer;
}

textarea::-webkit-scrollbar-thumb {
  background-color: #babac0;
  border-radius: 16px;
  border: 4px solid #fff;
}

textarea::-webkit-scrollbar-button {
  display: none;
}

<textarea>Gingerbread cheesecake bonbon cotton candy cheesecake. Topping pudding ice cream cupcake apple pie pastry caramels. Lemon drops ice cream icing chocolate bar dessert ice cream ice cream. Chocolate cake biscuit cotton candy.

Danish tiramisu tiramisu macaroon fruitcake caramels topping. Halvah oat cake donut. Chocolate cake sugar plum gingerbread jelly cookie. Bear claw marzipan biscuit soufflé donut.

Apple pie chocolate cake tart liquorice pudding sweet roll. Pie gummi bears cake. Dessert apple pie carrot cake tiramisu bear claw.

Danish pie croissant. Cookie halvah lollipop sweet roll gummies wafer marzipan chocolate cake. Caramels chocolate cotton candy cotton candy candy canes. Jelly beans lollipop marzipan chocolate cake chocolate cake cookie.

Dragée bonbon oat cake sweet roll toffee jujubes chocolate cake bear claw sweet. Sesame snaps cupcake pie donut ice cream brownie. Danish carrot cake gummi bears oat cake sweet roll oat cake dessert chocolate cake cake. Caramels tart liquorice.

Gingerbread cheesecake bonbon cotton candy cheesecake. Topping pudding ice cream cupcake apple pie pastry caramels. Lemon drops ice cream icing chocolate bar dessert ice cream ice cream. Chocolate cake biscuit cotton candy.

Danish tiramisu tiramisu macaroon fruitcake caramels topping. Halvah oat cake donut. Chocolate cake sugar plum gingerbread jelly cookie. Bear claw marzipan biscuit soufflé donut.

Apple pie chocolate cake tart liquorice pudding sweet roll. Pie gummi bears cake. Dessert apple pie carrot cake tiramisu bear claw.

Danish pie croissant. Cookie halvah lollipop sweet roll gummies wafer marzipan chocolate cake. Caramels chocolate cotton candy cotton candy candy canes. Jelly beans lollipop marzipan chocolate cake chocolate cake cookie.

Dragée bonbon oat cake sweet roll toffee jujubes chocolate cake bear claw sweet. Sesame snaps cupcake pie donut ice cream brownie. Danish carrot cake gummi bears oat cake sweet roll oat cake dessert chocolate cake cake. Caramels tart liquorice.</textarea>

同样的东西也可以在这里编辑:https://jsfiddle.net/k4dm6pgL/

Answer 1

我找到了一个简单的解决方案，对我来说效果很好。

使用这个:

textarea {
    cursor: auto;
}