我正在为我的站点使用ZurbFoundation4框架。我想要一个导航栏，该导航栏位于标题下方，当您滚动过去时该标题会粘在页面顶部。这工作正常，除了当顶部栏粘在页面顶部时页面内容会跳起~45像素。可以在此页面上看到效果，尽管这是一个不同的导航元素:http://foundation.zurb.com/docs/components/magellan.html有什么方法可以解决这个问题，还是我必须更改我的网站设计以适应这个错误？文档在这里:http://foundation.zurb.com/docs/components/top-bar.htmlTopBarMenuItem1Level
请查看此JPG以供引用:我有一个出现在页面顶部的导航栏。我正在寻找的行为是:当您向上滚动时，相同的导航栏淡入并固定在屏幕顶部。我在这里使用的代码是有效的，除了我不确定如何设置一个规则来阻止导航在您向上滚动到其默认位置后粘在屏幕顶部。目前，使用下面的代码，导航仍然固定在顶部，即使您向上滚动到页面顶部也是如此。function(){varpreviousScroll=0;$(window).scroll(function(){varcurrentScroll=$(this).scrollTop();if(currentScroll>previousScroll){$('#header').
我有一些表格标题，我计划在用户向下滚动页面时将其设为粘性(固定)，但是当激活粘性时它们目前会缩小，我希望它们继承标题的宽度，但它们缩小了到当前文本的大小。我的JS:$(document).ready(function(){varstickyNavTop=$('.th').offset().top;解决方案:$(".thth").each(function(){$(this).width($(this).width());});$('.th').width($('.th').width());varstickyNav=function(){varscrollTop=$(window).s
我希望我的页脚成为粘性页脚并尝试遵循csstricksnegativemargintrick，但没有奏效。我试图在下面的plunker代码中模拟我的angular2应用程序。我希望贴纸不是固定的而是粘性的，并在主要部分中有更多内容时转到底部。请注意，页脚显示在主要部分的数据上方。http://plnkr.co/edit/WSUC4xLMWH6fY77UyFqI?p=preview&open=app%2Fapp.component.ts应用程序组件:Displaymyrouter-outlethere{{hero}}感谢任何修复和向下移动页脚的帮助。 最佳答案
这个问题在这里已经有了答案:Whydoes`overflow:hidden`prevent`position:sticky`fromworking?(5个答案)关闭2年前。我正在使用stickyfill在两列设计中粘贴我的列之一。我需要我的parent在不声明高度的情况下垂直填充。stickyfill检测支持position:sticky;的浏览器(firefox、safari)并让这些浏览器接管。我习惯于简单地将父级的溢出设置为隐藏，但在这种情况下，它会破坏position:sticky;的工作。我的解决方案是将父级的display属性设置为table。根据我的测试，这是可行的，但我
在我正在构建的网站的页面上，只会显示一个表格。无论屏幕的宽度/高度如何，我都希望该表格贴在屏幕的边缘。此表还需要有粘性/固定标题(因此当它们向下滚动时，标题仍然可见)，我发现这使事情变得复杂，因为宽度和高度似乎需要手动设置。此外，它需要能够水平滚动，以防出现大量列。我不希望它们都是10px宽，但随着尺寸的变化，表格本身仍然需要贴在屏幕的边缘。它可以在用户滚动时保持标题粘性，但元素的宽度和高度必须全部手动设置，这意味着它没有任何响应。这可能吗？我不反对JavaScript，但我更喜欢纯CSS解决方案。(JSFiddle)body{margin:0;padding:0;}table{tab
我正在为个人网站创建一个新布局。我正在使用TwitterBootstrap3，我的初始布局是使用asexample制作的“带粘性页脚的Bootstrap”示例(http://getbootstrap.com/examples/sticky-footer-navbar/)这是我的html:粘性页脚CSS:html,body{height:100%;/*Thehtmlandbodyelementscannothaveanypaddingormargin.*/}/*Wrapperforpagecontenttopushdownfooter*/#wrap{min-height:100%;hei
我在一个Angular网站上工作，我试图在所有View中实现一个粘性页脚，但是当内容超过窗口大小时页脚停止粘附并且出现滚动条。我尝试了很多不同的方法，比如在我的所有内容周围添加一个包装器，添加一个.pushdiv但似乎没有任何效果。有没有人遇到过这个问题并修复它或知道某种插件等。我可以用来完成这项工作吗？这是我的代码:Youareusinganoutdatedbrowser.Pleaseupgradeyourbrowsertoimproveyourexperience.NoteSnapLogout还有我的CSS:html,body{height:100%;}html{font-fami
我正在开发一个涉及大量滚动、利用粘性定位的Web界面，除了一个小细节外，它的工作效果非常好。下面是一个极简主义的例子。你可以tryitonCodePen查看即时贴在水平和垂直滚动时的工作原理。MenubaritemButtonBarwiderthanthewindow*{line-height:2em;background-position:centercenter}body{margin:0;padding:0}body,a{color:#fff}ul,li{margin:0;padding:0;list-style-type:none}.flex{display:flex}.fle
我在网上搜索了100次，只为找到我想要的东西。我一无所获，并尝试自己做。两天后我因为很多原因放弃了。所以我在这里问大家是否有人可以为我做这件事。想想一个棍子标题，你向下滚动一个网站，标题固定在顶部。所以我的想象是，每次标题点击带有data-color="#2D2D2D"的部分时，标题背景颜色都会随之改变。但是等等，我希望它与背景图像成线性关系，所以如果他向后滚动，它的着色与之前的颜色成线性关系。这是我看过的文章。但它只是一个图像，它在内容中。https://codyhouse.co/demo/fixed-background-effect/index.html这是我的笔(只是试了一下)
