作家
登录

jquery BS,dialog控件自适应大小

作者: 来源:www.28hudong.com 2013-03-30 02:30:49 阅读 我要评论

样式有点丑,为此,还重搞了个样式,哪知以为完工的时候,发现IE上工作不正常,自适应大小等无法实现。 原来它需要xhtml才行,而公司的产品是html的。为此,研究了一下自适应大小的实现。 原来一直觉得jquery取宽度高度很神奇,原来是直接取的dom中element的offsetWidth/offsetHeight等属性,当有element插入dom中,浏览器就会根据规则计算出相应的属性,这里抄几个相关的属性。 scrollWidth 是对象的实际内容的宽,不包边线宽度,会随对象中内容的多少改变(内容多了可能会改变对象的实际宽度)。 clientWidth 是对象可见的宽度,不包滚动条等边线,会随窗口的显示大小改变。 offsetWidth 是对象的可见宽度,包滚动条等边线,会随窗口的显示大小改变。 clientWidth、offsetWidth、clientHeight..区别 IE6.0、FF1.06+: clientWidth = width + padding clientHeight = height + padding offsetWidth = width + padding + border offsetHeight = height + padding + border IE5.0/5.5: clientWidth = width - border clientHeight = height - border offsetWidth = width offsetHeight = height (需要提一下:CSS中的margin属性,与clientWidth、offsetWidth、clientHeight、offsetHeight均无关) offsetwidth:是元素相对父元素的偏移宽度。等于border+padding+width clientwidth:是元素的可见宽度。等于padding+width scrollwidth:是元素的宽度且包括滚动部分。 研究了下实现不了的原因。原来是jquery.alerts控件里面全是div的,简单的HTML在IE里,div的宽度似乎不根据内部内容变大而变大,直接有多大就多大,这样取到的offsetWidth就很大了,自适应大小就没实现,当然XHTML的情况取offsetWidth就可以了。 看了下EXT的实现方式,它就聪明多了,内部内容用span等随内容大小变化的el,这样取到offset属性就真实了,然后将内部一个个el的宽度都加上,包括padding和border,算出外层的总宽度。 虽然也想简单用xhtml,但没办法。还是学EXT,虽然麻烦一些,但可靠。

  推荐阅读

  jQuery DIV弹出效果实现代码

先上个效果图,可以点击Close按钮或是在遮罩层上任意处点击,就可以关闭弹出层。 HTML代码复制代码 代码如下:<div id='pop-div' style="width: 300px" class="pop-box" > <h4>标题位置</h4> <div class="pop-box->>>详细阅读


本文标题:jquery BS,dialog控件自适应大小

地址:http://www.17bianji.com/kaifa2/JS/28500.html

关键词: 探索发现

乐购科技部分新闻及文章转载自互联网,供读者交流和学习,若有涉及作者版权等问题请及时与我们联系,以便更正、删除或按规定办理。感谢所有提供资讯的网站,欢迎各类媒体与乐购科技进行文章共享合作。

网友点评
自媒体专栏

评论

热度

精彩导读
栏目ID=71的表不存在(操作类型=0)