Firefox input 光标丢失

在用Firefox浏览页面时是否发现鼠标点击 textarea,input表单输入文本时闪烁的光标不见了,但能正常输入文本呢?
你很幸运遇到了”Firefox光标丢失”的问题,前阵子也被这问题搞到头晕晕的,总结一下出现这问题的原因做了个简单的例子。
光标丢失据我所知是Firefox的BUG,在IE系列及Opera 等浏览器均正常! 有可能在Firefox3.0后会修复这问题,但我们现所用的都是2.0

事例1:

以下面为例,总结了页面容器中设置了以下部分属性,均会导致Firefox光标丢失：

overflow:auto
overflow-x:auto;
overflow-y:auto;
overflow:scroll
overflow-x:scroll;
overflow-y:scroll;
overflow-x:hidden;
overflow-y:hidden;
position:absolute

注意:上面没写到overflow:hidden; 因为overflow:hidden;可以正常使用没影响到Firefox的光标丢失

上面例子解决的办法:

1. 避免在body设置会令光标丢失overflow:XXX属性,overflow:hidden;除外参考事例2
2. 在position:absolute;加多个针对FF写的position:fixed; 但IE6不支持此属性,可以写成:#box { position:fixed;_position:absolute; …参考事例3

引用自：http://blog.gulu77.com/?p=10

Firefox input 光标丢失相关推荐

css input光标粗细,如何用CSS原生属性caret-color改变input输入框光标颜色
表单对大家来说并不陌生,当然,我也不是来和大家聊怎么做表单或者处理表单的样式网格,因为这些对于大家来说都是小儿科的东西.而是来聊聊怎么改变表单控件中光标的颜色.日常开发中我们可能会有改变input光标 ...
input长度随输入内容动态变化 input光标定位在最右侧
<input type="text" οnkeydοwn="this.onkeyup();" οnkeyup="this.size=(this. ...
ios端input 光标问题
ios端input 光标很大,输入文字后跟随文字变小,设置input line-height即可
jtopo影响了input光标左右移动
背景: 在使用 JTopo绘制流程图后, 页面上的文本输入框(input)通过键盘左右键移动光标失效原因: jtopo-0.4.8.js 中的m(b) 方法,对4个方向键进行了屏蔽,放开屏蔽即 ...
VUE 移动端处理input光标定位在最后的问题（简单版）
在Vue中使用JS调整input光标位置,让他保持在最后在调试移动端的时候,由于触摸事件,光标有时候会错位,所以导致有需求需要控制js光标的位置,要么在前要么在后,在查了相关的资料后,发现其实很简 ...
html input光标位置,js控制input框内光标位置（setSelectionRange详解）
问题描述前段时间碰到一个需求:在表单中有一个字段叫金额,用户希望点击该输入框后(focus),能够自动为其金额数字后加上"万元"两个字. 虽然这个需求可以通过其他的设计方式规避( ...
CSS改变input光标颜色
在使用 input 输入框时,我们可能会遇到需要给其设置光标颜色的情况.谷歌浏览器的默认光标颜色是黑色的,GitHub 上的光标却是白色,那么这个用 CSS 怎么改变呢? 上面描述的情景有两种实现方式 ...
IOS input 光标大小调整
前言在项目中做移动端页面,发现IOS 的光标大小很大,和安卓的完全不一样,思考怎么调整大小,搜索之后发现,里面挺好玩的.觉得是可以总结一下的. 结论 IE:不管该行有没有文字,光标高度与font-s ...
vue 获取input光标位置,并实现插入模板语法。
点击上面的模板说明,可以在输入框的光标位置插入相应的语法. <el-form-item label="模板说明:" v-if="form.news_type===' ...

Firefox input 光标丢失

Firefox input 光标丢失相关推荐

最新文章

热门文章