W3C home > Mailing lists > Public > public-css-archive@w3.org > February 2018

Re: [csswg-drafts] [CSS Positioned Layout Module] is it possible to have a position: sticky horizontal scrollbar?

From: vicols92 via GitHub <sysbot+gh@w3.org>
Date: Thu, 01 Feb 2018 11:07:17 +0000
To: public-css-archive@w3.org
Message-ID: <issue_comment.created-362233692-1517483236-sysbot+gh@w3.org>
You can create a custom progressbar that checks the width of the element. And make it always visible. 

Here is the code for mine. Altough this is watching the height. Not the width. 

```
<progress id="progressbar2" value="0" max="100"></progress>
```

```
jQuery(document).ready(function( $ ) {

    var l = $('#progressbar2');

    if (l.length >= 1) {
    $(window).scroll(function () {
        var position = window.pageYOffset;
        if (position > 100) {
            $('#progressbar2').css('opacity', '1');
        } else {
            $('#progressbar2').css('opacity', '0');
        }

        var s = $(window).scrollTop(),
            d = $(document).height(),
            c = $(window).height();

        var scrollPercent = (s / (d - c)) * 100;
        var position = scrollPercent;

        $("#progressbar2").attr('value', position);
    });

    }

});

```

-- 
GitHub Notification of comment by vicols92
Please view or discuss this issue at https://github.com/w3c/csswg-drafts/issues/2252#issuecomment-362233692 using your GitHub account
Received on Thursday, 1 February 2018 11:07:23 UTC

This archive was generated by hypermail 2.4.0 : Thursday, 24 March 2022 20:26:46 UTC