当元素宽度增加时，位置粘滞不适用于水平滚动
。位置粘滞（position: sticky）是CSS中的一种定位方式，它可以使元素在滚动到特定位置时固定在屏幕上。然而，当元素宽度增加时，位置粘滞不适用于水平滚动的情况。
位置粘滞通常用于垂直滚动的场景，比如固定导航栏或者侧边栏。当页面垂直滚动时，当元素滚动到指定位置时，它会固定在屏幕上，直到滚动到另一个指定位置或者到达页面底部。
然而，当元素宽度增加时，水平滚动会导致页面的宽度增加，而位置粘滞只能在垂直方向上生效。因此，无论元素的宽度如何增加，位置粘滞都无法实现水平方向上的固定效果。
对于水平滚动的场景，可以考虑使用其他的CSS属性或者JavaScript来实现元素的固定效果。比如，可以使用position: fixed来固定元素的位置，或者使用JavaScript监听滚动事件，根据滚动位置来动态改变元素的样式。
腾讯云相关产品和产品介绍链接地址：
- 腾讯云服务器（CVM）：https://cloud.tencent.com/product/cvm
- 腾讯云云原生应用引擎（TKE）：https://cloud.tencent.com/product/tke
- 腾讯云数据库（TencentDB）：https://cloud.tencent.com/product/cdb
- 腾讯云CDN加速（CDN）：https://cloud.tencent.com/product/cdn
- 腾讯云人工智能（AI）：https://cloud.tencent.com/product/ai
- 腾讯云物联网（IoT）：https://cloud.tencent.com/product/iot
- 腾讯云移动开发（移动推送）：https://cloud.tencent.com/product/umeng
- 腾讯云对象存储（COS）：https://cloud.tencent.com/product/cos
- 腾讯云区块链（BCS）：https://cloud.tencent.com/product/bcs
- 腾讯云虚拟专用网络（VPC）：https://cloud.tencent.com/product/vpc
相关·内容
我正在尝试使用position: sticky阻止一个元素滚动经过left: 0。这在某些情况下工作得很好，但我注意到，如果元素宽度增加，它就会停止工作。</div> </div>当header元素的<
浏览 11提问于2019-08-10得票数 4
回答已采纳
我有一个带有水平滚动条的表格。当水平滚动表格时，我需要使前两行的数据粘滞。这是第一个位置的表格：当我滚动时，我希望"2016“和"Dec”一直显示到" 2017“和" Jan "，2017和Jan也是如此，直到我到达下一个日期。这是滚动时的图片：下一次约会时的照片：请注意，我不想
浏览 1提问于2017-03-22得票数 1
有了一个水平粘性元素，我希望width不能是auto，粘性元素才能正常工作。 因此，虽然这段代码可以工作，但删除width: 100px;将导致非粘性行为。 我假设浏览器需要宽度来检测元素何时离开视口，但是为什么在水平模式下自动计算的宽度不起作用，而在垂直模式下不起作用？
浏览 16提问于2019-02-16得票数 1
回答已采纳
因此，如果列表项太长，包装器将允许水平滚动： overflow: auto;下面是我正在使用的一个JSFiddle：
默认情况下，ca
浏览 1提问于2018-06-02得票数 0
回答已采纳
1回答
我有一个包含多个可拖动元素的div。当我向右拖动一个元素时，会出现水平滚动条，我可以滚动div。它看起来是这样的：
但是，当我向左拖动元素时，水平滚动条不显示。我知道这是浏览器的默认行为，不显示滚动条是“正确的”，但是如果有人有任何建议，如何在移动元素离开时使溢出也工作，将不胜感激！蒂娅！
浏览 2提问于2016-11-16得票数 1
我正在创建一个具有水平方向的ListView。突出显示设置为视图的一个固定位置，以便列表元素在我增加/减少当前项时滚动到可见区域。preferredHighlightEnd: width*0.4}
我希望当前项的delegate比所有其他元素具有更大的宽度但是，当所有委托的宽度不相同时，列表
浏览 1提问于2014-12-22得票数 0
2回答
下面是我的水平ScrollView代码using Foundation;using System.Collections.Genericbase.DidReceiveMemoryWarning (); }
}
我想要创建一个垂直滚动视图并添加一些可滚动的文本视图如
浏览 6提问于2015-12-15得票数 4
回答已采纳
1回答
我需要创建表单，当滚动通过一个新的全宽元素时保持粘滞。
红色矩形是粘滞的，当滚动时，它将粘滞在视口的顶部。我在这里面临的问题是，即使到达绿色部分，我也需要红色矩形保持粘滞。父容器正在调整其子元素，红色矩形的位置是
浏览 14提问于2020-03-07得票数 0
2回答
我有一个简单的代码，重复使用Spritekit的背景，我希望背景是静止的任何触摸发生之前，只有开始动画或滚动时，任何触摸开始 bg.run(animateTheBackground) }
我希望这个代码发生时，
浏览 0提问于2017-07-16得票数 0
1回答
我有一个固定宽度的div，它的内部有许多图像是通过float:left;水平对齐的，所以div是使用scrollBar水平滚动的。我想通过点击两个"NEXT“和”“图像来滚动元素(如滑块)。{ left: "+=50"}, 5000, function() {});
但是，这个解决方案似乎只在元素由position: abso
浏览 2提问于2014-02-04得票数 1
始终100%的可用浏览器宽度。
使用jquery插件将页面标题和表标题行固定在页面顶部。我可以使用的位置:固定，但然后，当表格强制页面滚动水平，它所有的中断，因为你不能水平滚动与位置:固定。因此，jqu
浏览 3提问于2011-09-22得票数 0
回答已采纳
我已经在asp.net页面中创建了一个TreeView，还设置了TreeView.But的高度和宽度，当节点数增加时，它不适合指定的border.So，我想动态设置TreeView的大小，如果它溢出，还可以设置水平滚动条，垂直滚动条。
浏览 1提问于2012-04-25得票数 0
回答已采纳
4回答
然而，当列的数量变得太大时，我无法在视图中看到我的所有列(尽管它们在那里)。问题是，似乎没有水平滚动条。我可以垂直滚动我的行，但我还没有找到一种方法来水平地查看我的列，就像您在数据源选项卡上所做的那样。
如果有人能帮我找到实现这一目标的方法，那就太棒了！
浏览 4提问于2018-12-31得票数 3
回答已采纳
$(window).scroll(function(){})
浏览 1提问于2017-06-08得票数 1
4回答
我想要在可滚动网格的可见区域水平地对一个元素。因此，最后一行中的文本应该在蓝线内水平居中。，这就是我想要的：当滚动时，它应该保持居中和可见：，这就是我到目前为止得到的：<div class="wrapper">console.log(el.clientWidth);
el.style.maxWidth = el.clien
浏览 10提问于2022-05-06得票数 0
回答已采纳
3回答
我如何在页面上创建一个固定的div容器，这样当页面宽度缩小时，容器中的元素就会保持静态，并且只会从页面的左边和右侧溢出。我还需要容器保持在页面的中心，没有任何水平滚动。大宽度：
较小宽度：
我试过使用white-space: nowrap; overflow-x: hidden，但这并不适用于我。在上面的例子中，有7个不同的框(假设这是7个不同的图像)，如果屏幕宽度变得非常宽，我可以重复。
浏览 0提问于2019-09-10得票数 1
回答已采纳
1回答
可以将水平滚动条绑定到时间轴上吗？我需要为visjs时间线实现一个水平滚动条。当时间线被拖动时，滚动条应该会自动更新，当我滚动时间线时，时间线应该会平滑地移动。
浏览 0提问于2016-04-20得票数 2
1回答
我有一个Facebook的新闻馈送显示在一个无限的水平滚动容器，它应该只滚动之间的新闻元素，并防止默认的连续滚动行为。
首先，我检测用户滚动
浏览 11提问于2017-07-28得票数 3
然而，左栏的行为很奇怪:它会在大约50%的网格宽度后向左滚动，这并不是预期的结果。如果我想让左边的列停留在左边而不是被滚动，我应该怎么做？
浏览 19提问于2018-07-26得票数 1
回答已采纳
1回答
我一直在尝试实现滚动条来滚动画布的内容。
我所做的基本上是为滚动条创建一个overflow设置为scroll的div，以及一个根据画布内容的宽度/高度变化的内部div。当我在两个滚动条中的任何一个上获得onscroll事件时，我可以使用scrollLeft和scrollTop属性来设置需要多少像素来移动画布内容。我注意到，当垂直滚动条正常工作时，改变水平滚动条的内部宽度没
浏览 0提问于2012-08-08得票数 0
回答已采纳
扫码
添加站长 进交流群
领取专属 10元无门槛券
手把手带您无忧上云
相关资讯
热门标签
云服务器
ICP备案
对象存储
腾讯会议
实时音视频活动推荐
腾讯云开发者
