Fix RTL outer width problem.

`offsetWidth` doesn't work for hidden elements.
This commit is contained in:
Hyunje Alex Jun 2015-01-26 17:01:37 +00:00
parent 48eb80bd7f
commit 0acf3602f0
3 changed files with 15 additions and 7 deletions

View File

@ -53,6 +53,14 @@ exports.removePsClasses = function (element) {
} }
}; };
exports.outerWidth = function (element) {
return this.toInt(d.css(element, 'width')) +
this.toInt(d.css(element, 'paddingLeft')) +
this.toInt(d.css(element, 'paddingRight')) +
this.toInt(d.css(element, 'borderLeftWidth')) +
this.toInt(d.css(element, 'borderRightWidth'));
};
exports.env = { exports.env = {
isWebKit: 'WebkitAppearance' in document.documentElement.style, isWebKit: 'WebkitAppearance' in document.documentElement.style,
supportsTouch: (('ontouchstart' in window) || window.DocumentTouch && document instanceof window.DocumentTouch), supportsTouch: (('ontouchstart' in window) || window.DocumentTouch && document instanceof window.DocumentTouch),

View File

@ -44,6 +44,7 @@ function Instance(element) {
i.scrollbarYRight = h.toInt(d.css(i.scrollbarYRail, 'right')); i.scrollbarYRight = h.toInt(d.css(i.scrollbarYRail, 'right'));
i.isScrollbarYUsingRight = i.scrollbarYRight === i.scrollbarYRight; // !isNaN i.isScrollbarYUsingRight = i.scrollbarYRight === i.scrollbarYRight; // !isNaN
i.scrollbarYLeft = i.isScrollbarYUsingRight ? null : h.toInt(d.css(i.scrollbarYRail, 'left')); i.scrollbarYLeft = i.isScrollbarYUsingRight ? null : h.toInt(d.css(i.scrollbarYRail, 'left'));
i.scrollbarYOuterWidth = i.isRtl ? h.outerWidth(i.scrollbarY) : null;
i.railBorderYWidth = h.toInt(d.css(i.scrollbarYRail, 'borderTopWidth')) + h.toInt(d.css(i.scrollbarYRail, 'borderBottomWidth')); i.railBorderYWidth = h.toInt(d.css(i.scrollbarYRail, 'borderTopWidth')) + h.toInt(d.css(i.scrollbarYRail, 'borderBottomWidth'));
i.railYMarginHeight = h.toInt(d.css(i.scrollbarYRail, 'marginTop')) + h.toInt(d.css(i.scrollbarYRail, 'marginBottom')); i.railYMarginHeight = h.toInt(d.css(i.scrollbarYRail, 'marginTop')) + h.toInt(d.css(i.scrollbarYRail, 'marginBottom'));
i.railYHeight = null; i.railYHeight = null;

View File

@ -32,22 +32,21 @@ function updateCss(element, i) {
} }
d.css(i.scrollbarXRail, xRailOffset); d.css(i.scrollbarXRail, xRailOffset);
var railYOffset = {top: element.scrollTop, height: i.railYHeight}; var yRailOffset = {top: element.scrollTop, height: i.railYHeight};
if (i.isScrollbarYUsingRight) { if (i.isScrollbarYUsingRight) {
if (i.isRtl) { if (i.isRtl) {
railYOffset.right = i.contentWidth - element.scrollLeft - i.scrollbarYRight - i.scrollbarY.offsetWidth; yRailOffset.right = i.contentWidth - element.scrollLeft - i.scrollbarYRight - i.scrollbarYOuterWidth;
} else { } else {
railYOffset.right = i.scrollbarYRight - element.scrollLeft; yRailOffset.right = i.scrollbarYRight - element.scrollLeft;
} }
} else { } else {
if (i.isRtl) { if (i.isRtl) {
railYOffset.left = element.scrollLeft + i.containerWidth * 2 - i.contentWidth - i.scrollbarYLeft - i.scrollbarY.offsetWidth; yRailOffset.left = element.scrollLeft + i.containerWidth * 2 - i.contentWidth - i.scrollbarYLeft - i.scrollbarYOuterWidth;
} else { } else {
railYOffset.left = i.scrollbarYLeft + element.scrollLeft; yRailOffset.left = i.scrollbarYLeft + element.scrollLeft;
} }
} }
d.css(i.scrollbarYRail, railYOffset); d.css(i.scrollbarYRail, yRailOffset);
d.css(i.scrollbarX, {left: i.scrollbarXLeft, width: i.scrollbarXWidth - i.railBorderXWidth}); d.css(i.scrollbarX, {left: i.scrollbarXLeft, width: i.scrollbarXWidth - i.railBorderXWidth});
d.css(i.scrollbarY, {top: i.scrollbarYTop, height: i.scrollbarYHeight - i.railBorderYWidth}); d.css(i.scrollbarY, {top: i.scrollbarYTop, height: i.scrollbarYHeight - i.railBorderYWidth});