diff --git a/src/lib/tabs/ink-bar.ts b/src/lib/tabs/ink-bar.ts
index 9ec6f2b8b0ed..b5ec5d72ea97 100644
--- a/src/lib/tabs/ink-bar.ts
+++ b/src/lib/tabs/ink-bar.ts
@@ -33,14 +33,13 @@ export class MdInkBar {
alignToElement(element: HTMLElement) {
this.show();
- this._ngZone.runOutsideAngular(() => {
- requestAnimationFrame(() => {
- this._renderer.setStyle(this._elementRef.nativeElement, 'left',
- this._getLeftPosition(element));
- this._renderer.setStyle(this._elementRef.nativeElement, 'width',
- this._getElementWidth(element));
+ if (typeof requestAnimationFrame !== 'undefined') {
+ this._ngZone.runOutsideAngular(() => {
+ requestAnimationFrame(() => this._setStyles(element));
});
- });
+ } else {
+ this._setStyles(element);
+ }
}
/** Shows the ink bar. */
@@ -54,18 +53,14 @@ export class MdInkBar {
}
/**
- * Generates the pixel distance from the left based on the provided element in string format.
+ * Sets the proper styles to the ink bar element.
* @param element
*/
- private _getLeftPosition(element: HTMLElement): string {
- return element ? element.offsetLeft + 'px' : '0';
- }
+ private _setStyles(element: HTMLElement) {
+ const left = element ? (element.offsetLeft || 0) + 'px' : '0';
+ const width = element ? (element.offsetWidth || 0) + 'px' : '0';
- /**
- * Generates the pixel width from the provided element in string format.
- * @param element
- */
- private _getElementWidth(element: HTMLElement): string {
- return element ? element.offsetWidth + 'px' : '0';
+ this._renderer.setStyle(this._elementRef.nativeElement, 'left', left);
+ this._renderer.setStyle(this._elementRef.nativeElement, 'width', width);
}
}
diff --git a/src/universal-app/kitchen-sink/kitchen-sink.html b/src/universal-app/kitchen-sink/kitchen-sink.html
index 117d4a79fe92..28f85d48bdc2 100644
--- a/src/universal-app/kitchen-sink/kitchen-sink.html
+++ b/src/universal-app/kitchen-sink/kitchen-sink.html
@@ -21,22 +21,21 @@ Button
Google
Google
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
+Button toggle
+
+Single selection
+
+ Ketchup
+ Mustard
+ Mayo
+
+
+Multi selection
+
+ Ketchup
+ Mustard
+ Mayo
+
Standalone
Hyperspinner enabled
@@ -63,11 +62,10 @@ Card
-
-
+Checkbox
-
-
+With a label
+Without a label
Chips