CODEWITHSUNDEEP
javascripthtmlcssinternet-explorer
Yarune
Yarune

Reputation: 83

Drag scrolling jagged in IE

I made a click and drag scrolling Image Viewer here.

It works like a charm in FF and Chrome, but IE is behaving weird. The diagonal movement is jagged, as if the scrolling is slow and every movement is seperately visible.

I'm scrolling the DIV like this (viewPort is a jQuery object).

viewPort[0].scrollTop = newy;
viewPort[0].scrollLeft = newx;

Is anybody able to create a smooth movement in IE9 and IE10?

Edit: I'm using IE10 on Windows 7. I've seen it working on IE10 on Windows 8.

Upvotes: 2

Views: 736

Answers (1)

tenbits
tenbits

Reputation: 8018

It is always a good practice, when dealing with mousemove/touchmove, to apply UI changes in a requestAnimationFrame callback. Consider this jsfiddle

I am not sure if this helps, but it is definitely some better approach.

There is event better solution with transforms. You apply for an image position:absolute styles and for the container overflow:hidden and position:relative. After that, you change not the scrollLeft/scrollTop of the container, but translate(Xpx,Ypx) for the image itself.

Upvotes: 2

Related Questions