Vertical Scroll Bar Counter

    0

    0

      // HTML
          <!-- VERTICAL SCROLL BAR -->
        <div class="verticalScrollBar">
          <div class="verticalScrollSlider"></div>
        </div>
      // HTML
      
      // CSS
      // VERTICAL SCROLL BAR
    .verticalScrollBar {
      position: fixed;
      width: 100%;
      z-index: 10000;
    
      .verticalScrollSlider {
        display: block;
        position: absolute;
        height: 3px;
        width: 100%;
        background-color: #000;
        z-index: 1000;
      }
    }
    
      // CSS
      
      
      // jQuery
      
      // VERTICAL SCROLL COUNTER
      $(window).scroll(function () {
        let wintop = $(window).scrollTop(),
          docheight = $(document).height(),
          winheight = $(window).height()
    
        let scrolled = ((wintop / (docheight - winheight)) * 100).toFixed()
        // console.log(scrolled)
    
        $(".verticalScrollSlider").css({ width: scrolled + "%" })
      })
    Codiga Logo
    Codiga Hub
    • Rulesets
    • Playground
    • Snippets
    • Cookbooks
    soc-2 icon

    We are SOC-2 Compliance Certified

    G2 high performer medal

    Codiga – All rights reserved 2022.