`

关于Div高度自适应

阅读更多

    项目到了末期啦,功能都已经实现啦。

    可是内测的时间各种各样的问题都出来啦,以前总觉得页面里的东西有什么难啦,现在真正到页面的时候还真是一个大问题呀?

     我在一个Div里嵌入了一个Iframe,当初没有什么内容也就没有看出来什么大问题,现在内容添加进去啦,问题也出来啦,Div不会动态改变高度去适应Iframe的高度,头痛呀。

     找了老半天终于找到一个不错的方法。在Iframe里添加一个Onload:

onload="style.pixelHeight=newsTypeAndItems.document.body.scrollHeight+30"

在IE里终于能动态适应啦,原以为终于解决啦,可是在火狐里一看还是不能动态的改变高度。哎,郁闷呀,有DIv方面的高手吗?帮忙看一下怎么解决?

分享到:
评论
1 楼 elfer 2008-05-02  
这是我用的:
function resetContent(){
  document.getElementById('container').style.height = (document.documentElement.clientHeight-10) + "px";
  document.getElementById('contentPanel').style.height = (document.documentElement.clientHeight-90) + "px";
}
window.onload=resetContent;
window.onresize=resetContent;

相关推荐

    子div含float,父div高度自适应的div+css布局写法

    div+css高度自适应网页布局,子div含float,父div高度自适应,已经通过测试的浏览器:ie6、ie7、ie8、火狐、Chrome。 代码来源: http://www.positioniseverything.net/articles/onetruelayout/equalheight

    使用JS+CSS实现DIV层自适应高度和宽度

    实现DIV层自适应高度和宽度 在网页设计中,DIV层的自适应高度和宽度是非常重要的,因为它可以使网页适应不同的浏览器大小和分辨率,从而提高用户体验。以下是使用JS+CSS来实现DIV层自适应高度和宽度的知识点: 一...

    div+css高度自适应

    ### div+css高度自适应详解 #### 一、引言 在前端开发中,随着屏幕尺寸的多样化以及响应式设计的需求日益增长,实现元素的高度自适应成为了一个重要的课题。高度自适应不仅能够确保页面在不同设备上的良好展示,还...

    div宽度自适应布局(左边自适应)

    在网页设计中,"div宽度自适应布局(左边自适应)"是一种常见的网页布局技术,它主要应用于响应式设计,使得页面在不同设备和屏幕尺寸下都能保持良好的视觉效果。这种布局方式强调左侧内容的宽度根据浏览器窗口大小...

    JS实现DIV高度自适应窗口示例

    标题中提到的是“JS实现DIV高度自适应窗口示例”,这表示我们要探讨如何利用JavaScript(简称JS)编写代码,使得网页中的一个特定的 DIV(即文档对象模型中的一个容器元素)能够根据浏览器窗口大小的变化而动态调整...

    css+div自适应窗口宽度

    本主题探讨的是如何利用CSS和div实现网页内容的自适应窗口宽度,确保无论用户浏览器窗口大小如何,页面都能保持良好的显示效果。 首先,我们要理解`min-width`属性。在示例代码中,`.divGlobal`, `.DivTop`, `....

    DIV 高度 自适应

    这篇博客《Div高度兼容性问题》(原链接:https://peacherdiy.iteye.com/blog/803569)可能探讨了如何处理`<div>`高度自适应时遇到的兼容性问题,这些问题通常涉及到不同的浏览器对CSS样式解析的差异,尤其是在旧...

    div宽度自适应布局(右边自适应)

    9. **百分比与视口单位**: 除了百分比,还可以使用视口相关的单位如`vw`(视口宽度的百分比)和`vh`(视口高度的百分比),使`div`宽度与浏览器视口大小关联,实现更灵活的自适应效果。 10. **浏览器兼容性**: 在实际...

    关于div自适应高度/左右高度自适应一致的js代码

    本文讨论的两种主要问题是左右两侧DIV高度自适应一致,以及DIV高度如何自适应屏幕变化。 首先,我们需要了解如何使两个或多个DIV元素的高度保持一致。在网页布局中,使用左右两侧布局(例如,侧边栏和主内容区)是...

    怎样让一个div高度自适应浏览器高度

    在网页设计中,让一个`div`元素的高度自适应浏览器高度是一个常见的需求,尤其是在创建全屏背景、响应式布局或者动态内容填充时。这个需求看似简单,但有时却容易让人困惑,因为仅设置`div`的高度为`100%`并不总是...

    JS控制DIV自适应高度

    然而,这种方法不适用于所有情况,特别是当需要精确控制div高度时。 2. **JS监听内容变化**:可以使用JavaScript的事件监听器,如`MutationObserver`,来检测div内容的变化。一旦内容发生变化,就重新计算div的高度...

    子元素div高度不确定时父div高度如何自适应

    此容器同样设置"clear:both"和"overflow:hidden",从而达到清除浮动并使父元素div高度自适应的效果。这种方法同样需要添加额外的HTML标签,同样存在不符合代码优化原则的问题。 第三种方法是使用HTML中的"br"标签,...

    div模拟textarea,解决高度自适应

    解决textarea文字太多无法高度自适应问题,使用div模拟textarea

    2列左窄右宽高度自适应且未知高度底部平齐CSS模板

    "2列左窄右宽高度自适应且未知高度底部平齐CSS模板"是一种常见的网页布局方式,这种布局通常用于创建内容丰富的网站,其中左侧栏提供导航或侧边信息,右侧栏展示主要内容。下面将详细介绍这种布局的实现原理和相关...

    Iframe 高度自适应,js控制Iframe 高度自适应.docx

    "Iframe 高度自适应,js 控制 Iframe 高度自适应" Iframe 高度自适应是指在网页中嵌入的 iframe 元素能够根据其内容自动调整高度,以适应不同的浏览器和屏幕尺寸。js 控制 Iframe 高度自适应是指使用 JavaScript ...

    div自适应高度

    div+CSS自适应高度,需要的朋友请下载

    Iframe 高度自适应浏览器高度

    这种技术常被用来实现...以上就是关于“Iframe高度自适应浏览器高度”的主要知识点,实践中可能需要结合具体场景和需求选择合适的方法。在实际应用中,还要考虑到兼容性问题,确保在不同浏览器和设备上都能正常工作。

    div ul li 嵌套后如何解决增加多个li后DIV高度自适应问题

    总的来说,通过合理设置 `li`、`ul` 和 `div` 的高度属性,以及使用 `clear:both` 解决浮动问题,我们可以实现 `div` 高度自适应 `li` 的功能。当在 `ul` 中添加更多 `li` 时,这个结构会自动扩展其高度以适应新的...

    DIV进阶效果集(圆角div、div自适应宽度、背景色渐变等)

    以上就是关于“DIV进阶效果集”的一部分内容,包括圆角`div`、自适应宽度、背景色渐变、多行自适应高度以及固定高度但内容自动变高等。在实际应用中,结合`div`与其他CSS属性,可以创造出更多富有创意和实用性的网页...

Global site tag (gtag.js) - Google Analytics