问题标签 [fixed]
For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.
jquery - Sticking and replacing headers to the top of the window while scrolling
In the project I'm working on, I have a number of divs with photos, each with a label that lists the YYYY/MM/DD of the photos within.
The functionality I'm trying achieve is to have the label of the current div stick to the top of the window as you scroll through so you know which photos you're looking at. When the next div of photos is scrolled through, this label replaces the stuck label as it reaches the top of the window.
1) I'm struggling to find efficient ways to detect when a label is at the top of the window. I don't like the following since looking through every label seem like overkill (the "stuckToTop" class adds fixed positioning to the label).
I have also tried:
Are there any suggestions for a more elegant approach?
2) I would also like the new label to push the previously stuck label upwards as the page is being scrolled up. You'll see this same effect when you're scrolling through Picasa's photo gallery, as new section labels push the previous ones out of the way.
I'm guessing this means I'll have to adjust the position of the stuckToTop label upwards every time the new label gets scrolled higher towards the top, eventually replacing it?
Thanks!
html - 表格单元格内的可滚动 DIV
我知道,我的回答很经典,但我找不到合适的解决方案,不是在这里,也不是使用谷歌。我正在尝试使用表格创建布局。我希望它table#layout
是 100% 的屏幕(不是更多)并且#content-td
可以滚动。我的解决方案在 FF/Chrome/Safari 中运行良好,但在 IE 中存在一些问题。如果#content-td
有height=100%
IE 将设置高度等于表格高度(这是错误的,因为我有#header
)。当我height=100%
从#content-td
IE 中删除时,此销售将崩溃。有没有没有 javascript 的解决方案来修复 div 的高度?
没有 doctype 可以正常工作,但我想要一个有效的文档。这是测试页。
css - 如何创建与 IE、FF 和 Chrome 兼容的位置固定的 div
我在左边固定(位置)。它有 style="overflow: auto" 然后其余的文章转到可滚动的右侧。
sidenav 中的某些选项在 IE 和 FF 中不可见。我了解不同浏览器的浏览器视图端口不同。如何调整 sidenav 的高度以便所有选项都可见。
我很感激任何帮助。
谢谢。
jquery - jquery 从顶部滚动到 px 计数,然后将 div 设置为从顶部固定到滚动的其余部分
当我滚动到页面下方的某个点时,我希望更改 div 的 css,即页面顶部的一定数量的像素。
在页面加载时,我会有一个静态定位的 div。一旦我开始向下滚动页面并从顶部点击一个点(例如 100px 用于演示目的),我想将静态 div 更改为从顶部固定为 20px。这将通过 jquery 的 css() 属性来完成。这将允许它一直保持在页面下方的固定 20 像素。
当我达到 100px 标记时,我可以使用什么 jquery 属性来知道。一旦有人回到顶部,我希望它也能恢复,这样 div 就会回到页面加载时的位置,而不是距离顶部 20px 的位置。
有任何想法吗?
html - 需要使 div 居中,但在到达某个左侧位置时停止,以便为侧边菜单留出空间
我忽略了这个可能有一个简单的答案。我的内容在主页上的 div 容器中。我希望它水平居中,但是当浏览器缩小到很小时,它会与我的侧菜单重叠。例如,我希望它在达到 200 像素时停止向左移动。
它目前以宽度为一半(-350px)的负边距为中心,然后将其定位为 50%。
我的CSS在这里
纸 {
}
任何帮助将非常感激
干杯
jquery - 如何让固定位置的 div 随内容水平滚动?使用 jQuery
我有一个带有以下 CSS 的 div.scroll_fixed
当 div 到达页面顶部时,我使用以下 jQuery 代码设置 .fixed 类。
这对于垂直滚动固定非常有用。但是对于一个小的浏览器窗口,水平滚动会导致与此固定 div 右侧的内容发生冲突。
我希望 div 水平滚动内容。
谁能指出我正确的方向。仍然用 JS/JQuery 弄湿我的脚。
我基本上希望它像本例中的第二个框一样工作。
css - 混合浮动和固定定位
这是float和fixed的标准用法:
_
- “littleDiv” div 在“bigDiv” div 的右侧,但不跟随滚动,
- 相反,“littleDivFixed” div 会滚动,但相对于“bigDiv” div 的位置不是很好(它总是卡在显示屏的左侧)。
_
是否有可能有一个混合两种行为的 div :
- 始终在“bigDiv”div 的右侧(固定距离为 10 像素),
- 始终在显示屏上(与顶部保持 10 像素的恒定距离)?
_
在此先感谢您的帮助。
html - 定位固定头
这是一个棘手的问题,至少对我来说。我有一个需要水平滚动的页面。页面顶部是一个菜单,需要始终以页面为中心保持在同一个位置。即使我要使用 jQ,我也不确定如何实现这一点,因为看起来我需要以两种不同的方式定位同一个 div。
这是页面:
http://www.coflash.com/testing/raycollins/gall1.php
由于某种原因,滚动条也没有出现,但在本网站的旧代码中可以正常工作:
http://www.raycollinsphoto.com
有任何想法吗?
css - 固定 div 背景重叠浏览器滚动条
我以前从未见过的非常奇怪的行为。
我有一个固定位置的 div,它有一个透明的 png 背景图像。z-index 设置为 -1,以便内容可以使用滚动条在固定图像上滚动。
我将它的底部和右侧定位在 0px,但图像与滚动条重叠(无论如何,在 FF 和 Safari 上。)
这是链接:
http://adamjcas.www59.a2hosting.com/pg/show/id/4
CSS:
我使用的一个技巧是正确使用:16px;
效果很好,因为总是(可能)有一个正确的滚动条。但底部滚动只是有时存在。这是一个简单的 CSS 问题吗?
html - div 总是在顶部
我想要一个始终可见的 div 在我的页面右侧。我称之为“#sidebar”。它漂浮在我的页面主体上。问题是当页面没有最大化或者在一些小监视器中浮动的 div 移动了主页(#container)。有什么想法可以解决这个问题吗?谢谢