diff --git a/src/components/slider/slider.js b/src/components/slider/slider.js index 9dbcce42e0f..68d494fb5db 100644 --- a/src/components/slider/slider.js +++ b/src/components/slider/slider.js @@ -53,20 +53,22 @@ function SliderDirective($$rAF, $window, $mdAria, $mdUtil, $mdConstant, $mdThemi scope: {}, require: '?ngModel', template: - '
' + - '
' + - '
' + - '
' + - '
' + - '
' + - '
' + - '
' + - '
' + - '
' + - '' + - '
' + - '
' + - '
', + '
\ +
\ +
\ +
\ +
\ +
\ +
\ +
\ +
\ +
\ +
\ + \ +
\ +
\ +
\ +
', link: postLink }; @@ -85,7 +87,7 @@ function SliderDirective($$rAF, $window, $mdAria, $mdUtil, $mdConstant, $mdThemi }; var isDisabledParsed = attr.ngDisabled && $parse(attr.ngDisabled); - var isDisabledGetter = isDisabledParsed ? + var isDisabledGetter = isDisabledParsed ? function() { return isDisabledParsed(scope.$parent); } : angular.noop; var thumb = angular.element(element[0].querySelector('.md-thumb')); @@ -270,8 +272,8 @@ function SliderDirective($$rAF, $window, $mdAria, $mdUtil, $mdConstant, $mdThemi function setSliderPercent(percent) { activeTrack.css('width', (percent * 100) + '%'); thumbContainer.css( - $mdConstant.CSS.TRANSFORM, - 'translate3d(' + (percent * 100) + '%,0,0)' + 'left', + (percent * 100) + '%' ); element.toggleClass('md-min', percent === 0); } diff --git a/src/components/slider/slider.scss b/src/components/slider/slider.scss index 96f80e8c2fa..f4b9c83daea 100644 --- a/src/components/slider/slider.scss +++ b/src/components/slider/slider.scss @@ -52,6 +52,11 @@ md-slider { display: block; margin-left: 4px; margin-right: 4px; + padding: 0; + + .md-slider-wrapper { + position: relative; + } /** * Track @@ -84,9 +89,8 @@ md-slider { .md-thumb-container { position: absolute; left: 0; - top: 0; - right: 0; - transform: translate3d(0,0,0); + top: 50%; + transform: translate3d(-50%,-50%,0); transition: transform 0.1s linear; } .md-thumb {