DataTables / DataTables/Scroller

scrollBody width switching from 100% to a calculated value on scroll

Open
#57 8 comments 0 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

Dominant language
TypeScript
Stars
83
Forks
66
PR merge metrics
No merged PRs in 30d

Description

I've experienced an issue with the scroller switching width of the table for me, especially when there is overflow, between 100% and a calculated value. This happens when I scroll the table. This creates a problem when scrolling as I see differences in how the table and scrollbars display.

Starting at line 487 in the scroller JS, I just added a forced style to make the width 100% of the container for the scroll and touchstart events. This fixed my issue; maybe this will help someone else.

    $(this.dom.scroller).on( 'scroll.DTS', function (e) {
        that._fnScroll.call( that );
        that.dom.scroller.style.width = "100%";
    } );

    /* In iOS we catch the touchstart event in case the user tries to scroll
     * while the display is already scrolling
     */

    $(this.dom.scroller).on('touchstart.DTS', function () {
        that._fnScroll.call( that );
        that.dom.scroller.style.width = "100%";
    } );

Contributor guide

No contributing guide indexed for this repository

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Research direction

Start in the scroller JavaScript around line 487 and reproduce the width change while scrolling a table with overflow. Compare the table and scrollbar rendering during scroll and touchstart; done means the scroller width remains consistent without causing display differences.

Written by the indexing model from the issue text.

Assessment

Tech stack
typescript
Domain
frontend
Issue type
Bug
Difficulty
3/5
Estimated time
1-2 days
Activity status
Stale
Clarity
Mostly clear
Newbie friendliness
38/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.