javascript - 如何创建一个仅使用主浏览器滚动条的 html 可滚动区域

标签 javascript html css scroll

我正在查看 JIRA ( e.g. here, an issue in JIRA 4 ) 中的一个问题,我注意到 JIRA 4 有一些有趣的滚动行为,当使用主浏览器滚动条向下滚动时,jira 标题向上滚动,然后是问题标题固定在顶部,然后问题的其余部分继续滚动。因此问题标题始终可见。

没有额外的垂直滚动条。它全部通过主浏览器滚动条滚动。所以它要么是 css 要么是 javascript 魔法!知道他们是怎么做到的吗?

干杯,

菲尔。

最佳答案

它动态地改变具有 position:absolute;top:76px; 的 div #stalker。当用户滚动时,将位置更改为 position:fixed;top:0 并将其保持在固定位置,使您能够滚动其余内容。


编辑

我创建了一个这种行为的例子,因为我很好奇,如果你想检查它,这里有演示 http://jsbin.com/igiji5/3

关于javascript - 如何创建一个仅使用主浏览器滚动条的 html 可滚动区域,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/4922181/

相关文章:

Javascript 调试 - 如何中断所有未知的点击事件

javascript - 这个Javascript会导致内存泄漏吗?

javascript - 获取完整的实际 html 页面源,包括框架集

html - 使用 Flask 的 CSS 背景图像

javascript - 在较小的屏幕上,滑出式选项卡应该贴在 Div 的左侧,无论如何

javascript - 使用曲线将输入范围弧形拇指连接到 slider

html - 背景颜色不适用于 <body>

javascript - 如何逐渐设置正在(冒泡)排序的元素的样式?

javascript - React-Native - 通过嵌套对象崩溃递归

javascript - 将 css calc 函数转换为 px 中的值