Javascript 我们可以避免闪烁光标与div重叠吗
我一直在寻找任何方法来处理光标在其他分区上闪烁的问题。为了让我的陈述更清楚，我添加了一个屏幕截图-Javascript 我们可以避免闪烁光标与div重叠吗,javascript,html,css,contenteditable,Javascript,Html,Css,Contenteditable,我一直在寻找任何方法来处理光标在其他分区上闪烁的问题。为了让我的陈述更清楚，我添加了一个屏幕截图- 灰色div是位于顶部的固定div，用于创建功能区 左侧有边框的白色区域实际上是一个属性为contentEditable=“true”的div，它使区域成为可编辑区域。Imp-可编辑区域的高度可以随着内容的增加而增加，也就是说，那里不能有滚动条 因此，当内容超出屏幕时，我们向下滚动，如果光标已放置在可编辑区域内，它将显示在功能区上 如果选择了图像上的可调整大小的边框，也会发生同样的情况。而且，这只针
<head runat="server">
<title></title>
<style type="text/css">
.wrapper {
width:960px;
height:auto;
min-height:600px;
margin-left:auto;
margin-right:auto;
border-left:1px solid #cfcfcf;
border-right:1px solid #cfcfcf;
box-shadow:0px 10px 10px #6f6f6f;
background-color:#ffffff;
margin-top:100px;
}
.container {
width:100%;
height:auto;
min-height:800px;
padding:10px;
font-family:Arial;
border:1px solid #3f3f3f;
box-sizing:border-box;
-moz-box-sizing:border-box;
-webkit-box-sizing:border-box;
}
.editor-ribbon {
height:100px;
position:fixed;
left:0px;
top:0px;
width:100%;
border-bottom:1px solid #cfcfcf;
width:100%;
background-color: #ffffff;
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr = '#f1f1f1', endColorstr = '#e3e3e3');
-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr = '#f1f1f1', endColorstr = '#e3e3e3')";
background-image: -moz-linear-gradient(top, #f1f1f1, #e3e3e3);
background-image: -ms-linear-gradient(top, #f1f1f1, #e3e3e3);
background-image: -o-linear-gradient(top, #f1f1f1, #e3e3e3);
background-image: -webkit-gradient(linear, center top, center bottom, from(#f1f1f1), to(#e3e3e3));
background-image: -webkit-linear-gradient(top, #f1f1f1, #e3e3e3);
background-image: linear-gradient(top, #f1f1f1, #e3e3e3);
}
</style>
</head>
<body>
<form id="form1" runat="server">
<div class="editor-ribbon"></div>
<div class="wrapper">
<div class="container" contenteditable="true">
</div>
</div>
</form>
</body>
.包装纸{
宽度：960px；
高度：自动；
最小高度：600px；
左边距：自动；
右边距：自动；
左边框：1px实心#cfcfcf；
右边框：1px实心#cfcfcf；
盒影：0px 10px 10px#6f6f；
背景色：#ffffff；
边缘顶部：100px；
}
.集装箱{
宽度：100%；
高度：自动；
最小高度：800px；
填充：10px；
字体系列：Arial；
边框：1px实心#3f3f；
框大小：边框框；
-moz框大小：边框框；
-webkit框大小：边框框；
}
.编辑器功能区{
高度：100px；
位置：固定；
左：0px；
顶部：0px；
宽度：100%；
边框底部：1px实心#cfcfcf；
宽度：100%；
背景色：#ffffff；
过滤器：progid:DXImageTransform.Microsoft.gradient（startColorstr='#f1f1f1'，endColorstr='#e3'）；
-ms过滤器：“progid:DXImageTransform.Microsoft.gradient（startColorstr='#f1f1f1'，endColorstr='#e3'）”；
背景图像：-莫兹线性梯度（顶部，#f1f1f1，#e3）；
背景图像：-ms线性渐变（顶部，#f1f1f1，#E3）；
背景图像：-o-线性梯度（顶部，#f1f1f1，#e3）；
背景图像：-webkit渐变（线性、中心顶部、中心底部、从（#f1f1f1）到（#e3））；
背景图像：-webkit线性渐变（顶部，#f1f1，#e3）；
背景图像：线性渐变（顶部，#f1f1，#e3）；
}
问题与功能区的背景过滤器/图像属性有关 将背景更改为简单颜色可以解决此问题
在我看来，你的答案是：它不会很快被修复 闪烁的文本光标与div重叠 状态：因延期而关闭 描述 输入的文本光标在重叠div上可见。文本光标不应变为可见，但应保持在重叠div下，因为整个输入（或可编辑文本区域）保持在该div下
在我看来，你的答案是：它不会很快被修复 闪烁的文本光标与div重叠 状态：因延期而关闭 描述 输入的文本光标在重叠div上可见。文本光标不应变为可见，但应保持在重叠div下，因为整个输入（或可编辑文本区域）保持在该div下
我也遇到了同样的问题，我解决的方法是在涉及的输入中添加
blur（）当用户滚动时，输入失去了焦点。我也有同样的问题，我解决的方法是在涉及的输入中添加
blur（）当用户滚动时，输入失去了焦点。您可以尝试使div不可选择：@Peter:谢谢您如此快速的响应，但在该区域内，我正在执行简单的文本编辑，如-使粗体、斜体等，如果没有选择，这是不可能的。对不起，我以为功能区中有闪烁，您是否能够创建一个复制错误的方法@Coloso:非常感谢！但是我们能看到IE中出现的相同效果吗？FF&Chrome没有这个问题！您可以尝试将div设置为不可选择：@Peter:谢谢您这么快的响应，但在该区域内，我正在执行简单的文本编辑，如-设置粗体、斜体等，如果没有选择，这是不可能的。对不起，我以为功能区中有闪烁，您是否能够创建一个复制错误的方法@Coloso:非常感谢！但是我们能看到IE中出现的相同效果吗？FF&Chrome没有这个问题！谢谢你的回复，但我想你可能还没有尝试过用红色、黄色、白色或任何其他浅色的解决方案。它仍然不起作用。谢谢你的回复，但我想你可能还没有尝试过用红色、黄色、白色或任何其他浅色的解决方案。它仍然不起作用。
.editor-ribbon {
height:100px;
position:fixed;
left:0px;
top:0px;
width:100%;
border-bottom:1px solid #cfcfcf;
width:100%;
background-color: gray;
}