jScrollPane
jScrollPane copied to clipboard
Scrolling by arrows is broken when browser zoom is enabled.
If I set animateScroll: true
and apply web page's zoom (in/out), the scrolling by arrows don't work properly.
You can see that here: http://jscrollpane.kelvinluck.com/scroll_to_animate.html
Don't forget to set the zoom. ;)
Thank so much!
Yes, if you add this CSS line
#container { transform: scale(1.1); }
and your mouse's scroll wheel to scroll down, jsp scrolls UP - but not at the very top, up to ~10% Please help where to debug!!
@theo-bittencourt - it seems to work fine for me in the current version of Chrome. What browser did you see the problem in?
@szepeviktor - does this effect the demos of the mousewheel plugin or is it specifically a jScrollPane thing?
video proof: http://www.youtube.com/watch?v=9OOgWF_qoN8&hd=1 watch it in full screen! or use an embedded link: http://www.youtube.com/embed/9OOgWF_qoN8?vq=hd720
@szepeviktor - I don't have the bandwidth where I am now to watch the video I'm afraid. I didn't claim that what you describe doesn't happen though... My question was whether the confusion is coming from the mousewheel plugin that jScrollPane uses to find out when the user has used the mouse wheel or whether the problem is due to some code in jScrollPane itself.
If you add your CSS to the mousewheel tests do they behave the same as when the transform isn't set or do they behave differently?
the video contains a part when I do the same scrolling on mousewheel's test page - it does the scrolling in the right direction so - I think - it is a jsp issue
any updates on this?
@vitch Do you have an advise for me? http://www.youtube.com/watch?v=9OOgWF_qoN8
Sorry for the slow reply - I was travelling when you opened the issue and couldn't watch the video on the connection I had available...
Interesting problem! I had a dig and it seems that the calculation on line 1298 goes wrong when scale is applied.
contentPositionY()
returns the position of element with scaling applied while the other numbers are without the scaling applied.
In your case you could hard code a / 1.1
into contentPositionY but I'll look for a more general solution...
@vitch How could I detect scale()
level is Javascript?
That's what I wasn't sure of and I couldn't find a quick solution.
The best approach may be for me to expose a setting for "transformScaleAmount" or something which you could manually set. If you know what you have set the transform
to then you could pass the same value in.
Otherwise the code could traverse all parents checking what .css('transform')
was set to but I can imagine that could get very complex (e.g. what happens when there are nested transforms?) and maybe not be reliable...
Would the first idea work in your situation?
This site is vertically responsive - using scale()
.
@vitch Do you find it possible to integrate getComputedStyle
into jScrollPane?
https://css-tricks.com/get-value-of-css-rotation-through-javascript/
So the scale is set dynamically? If it was a setting then you could re-init the scrollpane with the new value whenever you changed it...
getComputedStyle
doesn't seem to help. It returns none
for transform
when the element is nested in something which has a scale
set - basically it's the same as .css('transform'
in that you'd need to traverse the parents and calculate the number.
The other alternative would be to find an alternative to scrollHeight that returned the correct height taking into account the transform
...
Thank you.
I'm running into this issue (or similar?) with IE8 and zoom. I can detect the zoom level reliably, but I'd guess that the problem is that jQuery reports wrong values with e.pageY
, $.position()
and $.offset()
, etc. The values are reported as scaled (multiplied) with the zoom level. I'm not sure if there's a good way to solve this.
Is this still problem?
@illuusio If it is not fixed - probably - then yes.
ps. you commit with non-GitHub emails
Probably not. I have to see how to fix that commit thing, any ideas?
check git config --global user.email
set git config --global user.email "[email protected]"
only for this repo git config user.email "[email protected]"
Ok it was incorrect Email but do you have any clues or willing to make PR about this?
You seem to have force-pushed those last commits as they have a GitHub email now.
I just added my other email to Github setup and it started to work. I have to find time to investigate this.