textarea在IE、Firefox下统一效果的解决方案
2009-10-26 22:03
302 查看
如果用textarea的属性字数宽度(cols)和行数(rows)来控制textarea的大小你会发现在,在IE和FF下的每行字数和文字的行数都不相同,而且在字数不足滚动的情况下,IE是默认有滚动条的,而FF是没有滚动条的。 那如何控制textarea在IE中和FF中相同的效果呢,其实比较简单: 1、用textarea的宽度(widht)和高度(height)来定义textarea的大小; 2、让滚动条自适应:overflow-y:auto。 原文 在IE下,输入到textarea的字符长度如果超过textarea的显示宽度,会出现自动换行,如果不是以明确px限定textarea的宽度(比如使用百分比),重新显示这个textarea时会发现textarea自动变宽,以在一行内容纳所有已输入的字符。这在某写情况下会打乱页面的布局,比如这个textarea是放在一个DIV的dialogue中。 而在FF下,则不会出现自动换行的情况,FF自动为超出textarea宽度的字符增加水品滚动条以便拖动显示。即使重新显示textarea,也不会有自动变宽的变化。所以FF对于textarea的支持是不变的,从而是稳定的。 在网上搜到一些解决方案,看来很多人碰到了类似的问题,最终选定两个资料以备参考: 如何统一textarea在IE、Firefox下的效果 统一textarea在IE、Firefox下的效果 我最终选择的方案就是用px限定textarea的宽度,这样在FF和IE下的显示基本一致,除了IE下仍然会自动换行,但这样的宽度限定最大的好处就是不会让IE的自动变宽扰乱整个布局。 在解决浏览器兼容问题时,的确是有些问题需要仔细考虑的: 1.急需解决的到底是什么问题,是客户的需求,还是让页面在不同浏览器下表现一致 2.不同的解决方案会有怎样的后果,哪种更切合客户的需求 3.不同的解决方案的投入产出比 这些问题的答案,决定着投入的时间和工作量的相比,是不是有这个必要非得花工夫去找一些奇技淫巧来解决本无需过分关注的问题,从而忽略了最重要的客户需求。 |
相关文章推荐
- 统一textarea在IE、Firefox下的效果
- textarea 自适应窗口|IE、firefox 显示同样的效果
- IE, Firefox下,checkbox的钩钩一旦勾上,画面再刷新,钩钩还是勾上的解决方案
- JS在firefox和IE下差异及解决方案
- IE,Firefox,Chrome都可用的阴影效果
- ie firefox 点flash 卡死解决方案
- IE和Firefox(火狐)在JavaScript方面的不兼容及统一方法总结
- 用CSS实现Firefox 和IE 都支持的Alpha透明效果
- IE-谷歌浏览器无法上网|| Firefox可以上网||可以上QQ解决方案
- Iframe跨域自适应高度(兼容IE/Firefox)终极解决方案
- IE下设置unselectable与onselectstart属性的bug,Firefox与Chrome下的解决方案
- firefox中实现onpropertychange在IE下的效果(google 124,000条搜索结果都可无视了)
- Extjs 限制 textfield / textarea 输入字数 , 兼容 IE Firefox Chrome
- js操作textarea方法集合封装(兼容IE,firefox)
- IE和Firefox在JS方面的不兼容及统一方法总结
- CSS实现 Firefox 和 IE 都支持的半透明效果
- CSS图片倒影效果兼容firefox、IE等各主流浏览器
- javascript支持IE和firefox(FF)的渐变透明效果
- IE和Firefox(火狐)在JavaScript方面的不兼容及统一方法总结
- javascript获取textarea光标选择位置和内容方法(IE, Firefox)