gpt4 book ai didi

css - Chrome 错误?鼠标按下 + 移动时光标变化

转载 作者:技术小花猫 更新时间:2023-10-29 10:56:46 25 4
gpt4 key购买 nike

在 Chrome 中(我在 Win 7 上使用版本 16.0.912.75 m)我发现无论我将光标设置为什么,只要我按住鼠标左键并移动光标,光标类型就是更改为 text(即使页面上的任何地方都没有文本)。

这是一个错误吗?有谁知道如何绕过它,因为它让我的拖放工具看起来有点傻!

div {
background-color: lime;
height: 100px;
width: 300px;
cursor: wait;
}
<div></div>

原始 JSFiddle:http://jsfiddle.net/KJfbs/

编辑

正如下面@davgothic 的回答,添加 -webkit-user-select: none; 将解决没有文本时的问题。但是,如果我们绝对定位元素并将文本放在它后面,那么问题仍然存在。

div {
background-color: lime;
height: 100px;
width: 300px;
cursor: wait;
-webkit-user-select: none;
position: absolute;
top: 0;
left: 0;
}
<div></div>
<p>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc quis eros mi, non tristique diam. Cras auctor posuere urna, porta egestas metus sollicitudin at. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Integer id arcu quis ipsum feugiat consequat id sit amet velit. Vivamus at quam quis lacus pellentesque egestas eu sed nulla. Vestibulum arcu augue, ultrices quis lobortis vehicula, molestie ut velit. Donec egestas lacus id diam euismod a lacinia lorem ultrices.

Vivamus non mi nunc. Pellentesque vitae sodales magna. In ac urna tortor. Quisque mattis mollis magna ultricies pellentesque. Mauris sed lorem eget sem imperdiet volutpat. Fusce fringilla pretium enim, eu ultricies justo fringilla in. Aliquam ac dui risus, ut eleifend tellus.

Nulla facilisi. Fusce nec leo lectus, in porttitor est. Etiam in posuere tellus. Maecenas viverra nibh et odio aliquam at aliquet arcu ultricies. Aliquam in arcu ac mi mollis ultricies vitae dapibus risus. Integer a arcu eu ipsum fermentum dignissim a vitae nunc. Pellentesque consectetur rutrum metus. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Morbi semper dapibus nunc. Mauris congue est sit amet neque condimentum nec fermentum massa sagittis. In bibendum cursus tortor quis scelerisque. Mauris est nisi, elementum eu scelerisque vel, placerat quis erat. Nam malesuada massa quis sem eleifend tempor eget ut erat.

Etiam egestas ligula nec odio molestie placerat. Donec nunc dolor, venenatis id iaculis vel, dapibus quis justo. Suspendisse sed nunc eget nunc luctus hendrerit eget at tortor. Quisque consectetur, eros eget dictum lobortis, erat nisl eleifend metus, egestas vulputate purus urna ut arcu. Nunc mollis tempor mi, quis commodo diam semper id. Nulla sed urna sit amet tellus consequat elementum. Maecenas cursus ipsum sit amet nunc laoreet quis placerat urna tempor. Maecenas tristique sodales posuere. Mauris scelerisque ornare tincidunt. Nulla tempus gravida orci, vel lacinia ante placerat ac. Donec gravida erat vitae elit suscipit ac ullamcorper lacus faucibus.

Aenean dictum elit eu nunc varius suscipit. Praesent ultrices, nunc ullamcorper posuere consectetur, purus ipsum dictum nisl, ultrices rhoncus nisl mauris sit amet dui. Donec convallis arcu eu nibh laoreet pulvinar. Sed euismod volutpat nibh eget faucibus. Maecenas interdum dapibus consequat. Sed sit amet leo lectus, euismod molestie nunc. Donec dui tellus, dignissim ut luctus non, facilisis eu magna. Phasellus a neque et dui luctus porttitor. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec volutpat mollis dui, eget varius nunc gravida eu. Vivamus nibh erat, dapibus eu mattis blandit, sodales ut nisi. Vivamus pellentesque congue placerat. Pellentesque ultricies turpis vel odio imperdiet et facilisis leo viverra. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Lorem ipsum dolor sit amet, consectetur adipiscing elit.
</p>

原始 JSFiddle:http://jsfiddle.net/KJfbs/2/

最佳答案

尝试将 -webkit-user-select: none; 添加到该元素的 CSS 以防止文本选择。

示例:http://jsfiddle.net/KJfbs/1/

我个人也会添加这些...

-webkit-user-select: none;
-khtml-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
-o-user-select: none;
user-select: none;

...为了跨浏览器兼容性。

关于css - Chrome 错误?鼠标按下 + 移动时光标变化,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/8942805/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com