没有jQuery的粘边栏JavaScript [英] Sticky sidebar javascript without jQuery

问题描述

您如何制作带塞子的垂直粘边条，但没有 jQuery？是否有任何代码片段/插件？我不需要它来支持较旧的浏览器。

How do you make a sticky vertical sidebar with stopper, but without jQuery? Are there any snippets/plugins? I don't need it to support older browsers.

我的意思不是固定位置：固定，它必须留在同一位置然后开始发粘（固定）滚动到某一点时。然后必须在停止点停止跟踪。

I don't mean just position: fixed, it must stay in the same place and then start being sticky (fixed) when you've scrolled past a certain point. It must then stop following at the stop point.

像 http：// stickyjs .com ，但不是jQuery。有许多可用的jQuery插件。

Like http://stickyjs.com, but NOT jQuery. There are many jQuery plugins available.

推荐答案

基本上很简单：

window.onscroll = function() {
    var sticky = document.getElementById('stickynav');
    if( document.body.scrollTop+document.documentElement.scrollTop > 240)
        sticky.className = "stuck";
    else sticky.className = "";
};

然后只需在 .stuck 中定义样式该类向元素添加 position：fixed 之类的东西。

Then just define styles in the .stuck class that add things like position:fixed to the element.

这篇关于没有jQuery的粘边栏JavaScript的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！