本文介绍了一种解决ExtJS中Portal组件在使用autoScroll时出现横向滚动条的问题。通过直接修改内部元素的样式来避免不必要的横向滚动，并提供了解决该问题的具体步骤。同时分享了调试过程中使用的工具和技术。
//shappy 解决横向滚动条的问题
portal.body.dom.style.overflowX='hidden'
portal.body.dom.style.overflowY='auto'
Ext的Portal在高度太大时,如果autoScroll=true(默认),就会出现滚动条,但是很狗血的是同样会出现横向滚动条,实际上Ext的grid,tabPanel等多种容器都会出现类似的问题,但是解决方法不同.google和官方论坛上搜索了很久,相关主题有,但是都没有解答,今天终于解决了,需要手动修改里面层的样式,Portal从Panel继承,滚动条也是从Panel中继承过来的,通过firebug观察发现autoscroll=true时,会在里面的某个自动生成的div自动设置overflow:auto,要避免横向滚动条的出现,必须修改overflowX的设置,测试了Panle中几个样式的属性,都无法直接给目标div设置样式,观察了Panel的setOverflow代码后,采取了上面的直接修改样式的方式.
总结一下Ext问题搜索的技巧:
1 google上搜索命中率很低,可能和必须加上ext关键字有关,国内基本上搜索不到什么有价值的文章,所以想搜索到问题还是啃英文吧
2 官方论坛上提供了用Google做网内搜索的方法:[url]http://www.google.com/cse?cx=001733999371871106761%3Ajgc8jk2xgwe&ie=UTF-8[/url],官方论坛很慢,慢慢忍受吧
3 很多时候还是需要自己解决问题,ms script debugger和firebug是必备的工具,前者用于断点切入和观察对象属性,后者功能强大,我主要用来看层的一些属性和样式
4 Ext的帮助文件,见附件
portal.body.dom.style.overflowX='hidden'
portal.body.dom.style.overflowY='auto'
Ext的Portal在高度太大时,如果autoScroll=true(默认),就会出现滚动条,但是很狗血的是同样会出现横向滚动条,实际上Ext的grid,tabPanel等多种容器都会出现类似的问题,但是解决方法不同.google和官方论坛上搜索了很久,相关主题有,但是都没有解答,今天终于解决了,需要手动修改里面层的样式,Portal从Panel继承,滚动条也是从Panel中继承过来的,通过firebug观察发现autoscroll=true时,会在里面的某个自动生成的div自动设置overflow:auto,要避免横向滚动条的出现,必须修改overflowX的设置,测试了Panle中几个样式的属性,都无法直接给目标div设置样式,观察了Panel的setOverflow代码后,采取了上面的直接修改样式的方式.
总结一下Ext问题搜索的技巧:
1 google上搜索命中率很低,可能和必须加上ext关键字有关,国内基本上搜索不到什么有价值的文章,所以想搜索到问题还是啃英文吧
2 官方论坛上提供了用Google做网内搜索的方法:[url]http://www.google.com/cse?cx=001733999371871106761%3Ajgc8jk2xgwe&ie=UTF-8[/url],官方论坛很慢,慢慢忍受吧
3 很多时候还是需要自己解决问题,ms script debugger和firebug是必备的工具,前者用于断点切入和观察对象属性,后者功能强大,我主要用来看层的一些属性和样式
4 Ext的帮助文件,见附件
扫一扫
58
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
