Internet Explorer 10 doesn't display scroll bars correctly

Question

Internet Explorer 10 doesn't display scroll bars correctly

bakertony opened this issue 11 years ago · comments

Hi, if you view:
http://handsontable.com/demo/scroll.html
in IE 10 (e.g. on Windows 8) the scrollbars show on the left (overwriting left most column) and without the dark grey scroll handle:

If you open the page in 'compatibility mode' it does display correctly.
Cheers for producing an awesome product overall though!
Tony.

Marcin Warpechowski · Answer 1 · Mon Feb 18 2013 20:01:15 GMT+0800 (China Standard Time)

I am downloading IE10 image from http://www.modern.ie/en-US/virtualization-tools to see what I can do. Thanks for the report!

Tony · Answer 2 · Tue Feb 19 2013 06:00:25 GMT+0800 (China Standard Time)

No problem. by the way, I've just started using http://www.browseemall.com/ which makes life rather easy for testing cross browser compatibility, although it is showing it working in IE10, doesn't work in actual IE10.
Also note that browseemall shows it not working correctly in IE8.
Cheers,
Tony.

Marcin Warpechowski · Answer 3 · Tue Feb 19 2013 07:38:55 GMT+0800 (China Standard Time)

I tried reproducing it but no luck. Are you doing something special to reproduce it?

Tony · Answer 4 · Tue Feb 19 2013 08:07:10 GMT+0800 (China Standard Time)

Doing nothing special at all! All my extensions are disabled.
I just bringing up IE10, paste in the URL http://handsontable.com/demo/scroll.html and hit return:

Tony · Answer 5 · Tue Feb 19 2013 08:15:43 GMT+0800 (China Standard Time)

Wow, OK, this is strange, I just toggled on 'compatibility view' to confirm that it displays correctly. I then turned OFF 'compatibility view' and it NOW displays correctly!
Still displays correctly now even after restarting IE.
Unfortunately, the same can't be said for handsontable in my Web app, scroll bar displays incorrectly when I toggle compatibility view back off again :-(
WTF?! Damn IE...

Tony · Answer 6 · Tue Feb 19 2013 08:24:28 GMT+0800 (China Standard Time)

Hmm, one thing I do, is load in the data from an ajax call, I wonder if loading in the data once the spread is displayed is causing the issue?

Marcin Warpechowski · Answer 7 · Sat Apr 20 2013 02:39:39 GMT+0800 (China Standard Time)

I am sorry that I didn't reply sooner. Is this reproducible in current version (0.8.20)? Again, I cannot reproduce it neither in IE10 or IE10 Compatibility View.

Does anyone else also have this issue?

David Thompson · Answer 8 · Wed Apr 24 2013 03:17:41 GMT+0800 (China Standard Time)

I was having this same problem with handsontable 0.8.20 under IE10 with my own app, but not with the official examples. In my app, I traced the start of the problem back to this section in the handsontable JS:

    , totalCount
    , visibleCount
    , tableOuterWidth = this.$table.outerWidth()

The problem was that this.$table.outerWidth() was equating to 0 in IE10, unlike other browsers and older versions of IE. That eventually caused the width of the slider to be set incorrectly.

I found that upgrading my old jQuery version from 1.7.2 to 1.9.1 allowed outerWidth() to return the intended value and for the spreadsheet to load normally.

Marcin Warpechowski · Answer 9 · Wed Apr 24 2013 07:33:27 GMT+0800 (China Standard Time)

Thanks! I updated README.md to mention that 1.9+ is the preferred version of jQuery. I consider this solved then!