javascript - 如果超出父元素的高度,如何隐藏固定元素?

标签 javascript html css

我想知道如何隐藏 .entry-content 中的 .fixedElement 不允许它显示在 .header 上(蓝色部分).footer(绿色部分),一旦 .fixedElement 到达其父元素的顶部/底部,它就会隐藏它。

enter image description here

http://jsfiddle.net/cafgnzj3/

我了解到固定元素在其父元素 css 样式中不起作用,因为它基于浏览器的视口(viewport)。

我认为创建示例会容易得多。

如果可能的话,我也会试一试 javascript,以了解实现它的函数。

最佳答案

父CSS:{overflow:hidden;}

编辑:特别是:

<div class='some-tough-edges'>buncho stuffs</div>

.some-tough-edges { width: yourchoice; height: yourchoice; overflow: hidden; //display: block; if not using a block element }

edit2 : 不要在溢出中使用 fixed,在容器中固定位置,在其中使用绝对或相对

关于javascript - 如果超出父元素的高度,如何隐藏固定元素?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/33159273/

相关文章:

javascript - 引物/库循环函数仅执行一次

javascript - 如何在函数外部返回 this 的结果?

javascript - 在 D3 强制布局中的节点上显示鼠标悬停时的 div 元素

javascript - 无法在 Asp.Net RadioButtonList 项目选择上使用 Jquery 显示/隐藏 div?

javascript - div 位于表单内时的 div 单击事件

javascript - bootstrap.min.css 文件不支持

html - 调整浏览器窗口大小时,CSS 背景颜色宽度会减小

javascript - MeteorJs aldeed-autoform,如何从 bool 复选框中获取所需的值

javascript - 在 React Native 中将 Prop 传递给状态?

html - Bootstrap 嵌套行列高度