mkoryak/floatThead

Firefox: Problem with RTL Tables

alex2230 opened this issue · 6 comments

Hi,
I know that: "RTL is not really supported by floatThead"
floatThead works well on Chrome, and has no problems with RTL tables, But floatThead+RTL tables are not working properly on Firefox.

Is there a way to fix the problem with Firefox?

Please see the links below with Firefox And screen width smaller than 900 pixels:
I've used the "Bootstrap table responsive".
LTR: https://codepen.io/alex200/pen/XWWqLaQ
RTL: https://codepen.io/alex200/pen/VwwxJWe

sorry, this fell off my radar. Ill look soon

This happens because of how different browsers calculcate scrollLeft in RTL.
you need to include the following workaround to fix this:

https://github.com/othree/jquery.rtl-scroll-type

and this code:

var origScrollLeft = jQuery.fn.scrollLeft;
jQuery.fn.scrollLeft = function(i) {
    var value = origScrollLeft.apply(this, arguments);

    if (i === undefined) {
        switch(jQuery.support.rtlScrollType) {
            case "negative":
                return value + this[0].scrollWidth - this[0].clientWidth;
            case "reverse":
                return this[0].scrollWidth - value - this[0].clientWidth;
        }
    }

    return value;
};

Copied from:
https://stackoverflow.com/questions/24276619/better-way-to-get-the-viewport-of-a-scrollable-div-in-rtl-mode/24394376#24394376

I didnt test this, but this is what is happening here.

@mkoryak
Thanks for reply.

The jquery.rtl-scroll-type plugin adjusts the RTL-table header correctly, but when user scrolls left and right, the header does not change and is fixed!

Please see the links below with Firefox And screen width smaller than 900 pixels:
https://codepen.io/alex200/pen/MWWNMzQ

That's fun, I should have guessed some other calculations would need to be inverted.
I'm upgrading this to a bug.

Hi,
I like this repository, but it's pity that it doesn't support a functionality to freeze left column(s).
Is it possible or are there any good source?
Thanks