Clusterize.js icon indicating copy to clipboard operation
Clusterize.js copied to clipboard

Make it possible to use window as the scroll element

Open rjohnson06 opened this issue 9 years ago • 3 comments

I made getting and setting of the scroll position configurable. This makes it possible to use the window as the scroll element. Using JQuery for setting/getting window scroll position in the below example.

  var clusterizeOptions = {
            contentId: 'content-area',
            rows_in_block: 50,
            tag: 'tr',
            callbacks: {
                clusterChanged: function () {
                    Seatics.config.ticketRowRenderedHandler();
                    $("#tickets-table [data-toggle=tooltip]").tooltip();
                }
            },
            show_no_data_row: false
        };
            clusterizeOptions.scroll_top_getter = function () {
                return $(window).scrollTop();
            };
            clusterizeOptions.scroll_top_setter = function (amt) {
                $(window).scrollTop(amt);
            };
            clusterizeOptions.scrollElem = window;
        var clusterize = new Clusterize(clusterizeOptions);```

rjohnson06 avatar Jul 22 '16 17:07 rjohnson06

Hi

Why this PR is not merged yet?

kamaladenalhomsi avatar Jul 26 '20 11:07 kamaladenalhomsi

I found that using this solutions creates a visual hiccup when the clusters change. See video that shows what I mean. https://www.loom.com/share/c37e7b145c264c6f8f4df7afcb7be8ea

UPDATE: This happens because the scroll area doesn't have a max-height, as soon as I set one all works well again.

hcarneiro avatar Jan 21 '21 18:01 hcarneiro

I'm unable to get this example to work, is there a full example somewhere of using the windows scroll bar? or could someone please elaborate on what is required? I have implemented the changes from this PR locally and used the example above but it seems my 'clusterChanged' function is not being called and only able to see first 200 rows.

UPDATE: I actually got it working, the issue was I had css: body { overflow: auto; } once I removed that it worked.

JosephMawer avatar Aug 25 '22 20:08 JosephMawer