sticky 相关问题

在网页中,粘性元素是页面的一个元素,它保持在屏幕上的固定位置,使其始终可见。

在粘性元素上使用scrollIntoView

我正在尝试滚动一个位置固定在页面中心的元素。这意味着它在文档流中的不粘滞位置应位于视图的中心。关于Codepen的演示// // ...

回答 1 投票 0


position:sticky-到达页脚时不发粘

我有一个父容器。父容器有2个带有粘性页眉和页脚的子级。问题是,当用户滚动并到达页脚区域时,粘性页眉的...

回答 1 投票 0

如何在右侧创建位置?

我的演示和完整代码如下:https://codepen.io/happyforever/pen/bGGXJGR?editors=1010因此,我添加了以下内容:style =“ position:-webkit-sticky; position:sticky; top:0;背景:白色;”在...

回答 1 投票 0

带有adsense的Google AMP粘性广告?

AMP很好而且很快速,但是加载广告缓慢。我们在首屏上方使用320x100广告单元,当用户向下滚动时,甚至没有加载。另一个是页脚中的矩形广告单元,几乎是...

回答 1 投票 0

如何使左右网格变粘,中间一个在Bootstrap 4中可滚动

我正在使用Bootstrap 4来访问网站主页。我已经使用了3个网格,col-md-3,col-md-6,col-md-3。我希望第一个和最后一个网格在Position上保持粘性,而中间的网格可以滚动。

回答 4 投票 1

根据滚动位置更改内容

我正在尝试构建一个Showcase组件,类似于此处看到的组件,在该组件中,用户在滚动时浏览不同的内容:我通过使用一些CSS来固定该部分:.sticky {...

回答 1 投票 0

WordPress网站上的固定位置

我正在尝试在网站中制作一个粘性元素,该元素是使用自定义模板在wordpress中制作的。我正在尝试一切,从CSS(位置:粘性)应该可以正常工作。但就我而言并非如此。你可以...

回答 2 投票 0

如何使节变粘,直到用户滚动特定的长度

我正在尝试复制类似于Postmates舰队网站的内容,他们在该网站上使用位置:粘贴在一个区域上并更改该区域内的元素,直到用户滚动浏览所有......>

回答 1 投票 1

vue.js粘性导航栏仅执行一次,但有错误:scrollTop始终为0

全部。我正在尝试制作粘性栏,但是有问题:如果我按如下方式编写,则navBaroffsetTop始终为0,并且该函数fixNavBar()仅在加载页面时执行一次。 HTML:&...

回答 1 投票 0

使对象粘稠似乎不起作用

我一直在尝试在右侧贴上图像,而人们可以在左侧滚动显示艺术家姓名,但可能由于左侧已经滚动而无法正常工作。这是我的页面...

回答 1 投票 -1

使对象粘稠似乎不起作用

我一直在尝试在右侧贴上图像,而人们可以在左侧滚动显示艺术家姓名,但可能由于左侧已经滚动而无法正常工作。这是我的页面...

回答 1 投票 0

导航栏变粘时如何更改li的颜色?

当位置变粘时,我想更改导航栏上链接的颜色。 (“ links-color”)是一个CSS类,用于替换li上的现有类。粘性位置的代码是...

回答 3 投票 0

如何使页脚停留在页面底部

我正在放置一个粘贴在我的侧边栏底部的页脚。但是,一个小问题困扰着我。看来页脚从左边开始有一个空白,但是没有空白...

回答 1 投票 0


如何用网格固定STICKY标头?

为什么当我滚动超过100%的高度时,笔触位置不起作用(标题)? * {保证金:0;填充:0;列表样式:无;文字修饰:无; } html,正文{高度:...

回答 1 投票 0

我的粘性标头不起作用,为什么这样?

对于一个学校项目,我需要建立一个站点。所需的东西之一是标题,最好是粘性的。我去了w3schools,找到了一个教程,并将其放在了我的项目中,但是...

回答 1 投票 0

滚动时,角垫表粘性列重叠

我使用的是Angular 8的表(不使用flex),前2列为粘性。问题:主要问题是第一列和第二列之间的空间,这会导致其他问题。当我做...

回答 1 投票 0

滚动页面时不粘滞导航

因此,当我刚刚将示例中的代码复制并粘贴到HTML文件中的脚本标签中时,效果很好。当我开始向下滚动时,导航栏最终会停留在顶部。但是我想要...

回答 1 投票 0

offsetTop / getBoundingClientRect()。位置为粘滞的元素的顶部

[当元素的位置为:粘性时,到达其偏移量(例如,顶部:0)并在屏幕上停止,我无法正确获取其offsetTop,它显示的超出了必要。同时,我无法获得...

回答 1 投票 0

© www.soinside.com 2019 - 2024. All rights reserved.