jquery - 显示隐藏元素后的粘性侧边栏

标签 jquery html css sidebar sticky

我正在寻找可以执行特定操作的粘性侧边栏,但我什至不确定如何表达我的查询/如果存在类似的内容。

我想在位于标题/导航和图像正下方的边栏中有一个粘性号召性用语。当用户滚动时,我不希望号召性用语一直到达页面顶部。我希望它保持在相对相同的位置。我想用更多文本填充标题、导航和图像留下的空白。

当用户接近页面底部时,页脚会出现并根据需要将所有内容推离顶部。

我什至不确定这是否有意义,所以我制作了一张图片,展示了用户滚动时屏幕的样子。我没有发布它的声誉,所以它在 imgur 上结束了。 Check it

如果您对如何实现这一目标有任何想法,我将非常感谢您提供的任何见解。提前致谢。

最佳答案

你可以用 css 和 position fixed 属性来做到这一点。然后将顶部和右侧设置为您希望它距浏览器窗口顶部和右侧的距离。

    .stickySideBar
    {
    position:fixed;
    height:100px;
    width:100px;
    right:10px;
    top:200px;
    }

关于jquery - 显示隐藏元素后的粘性侧边栏,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/22817718/

相关文章:

javascript - 根据相邻元素的大小或值隐藏 flexbox 元素

javascript - 一年中的某一天集成到 jquery ui 日期选择器中

javascript - 从标签输入中获取值到 Twitter typeahead js

html - 分享这个按钮图片

jquery - 使用所选 jquery 添加事件后将事件添加到按钮

html - 在表格中垂直居中 img 和 h2

javascript - jQuery AJAX 请求返回原始 PHP,而不是运行 PHP 的结果

jquery - 在 jquery-mobile 中计算(不是 CSS)width()

javascript - 如何将日期选择器插入 MS Excel 单元格

html - 如何使用纯 CSS 实现事件侧边栏项的向外曲线