Skip to content
This repository has been archived by the owner on Sep 5, 2024. It is now read-only.

Commit

Permalink
perf(sticky): display: none non-adjacent sticky headers
Browse files Browse the repository at this point in the history
  • Loading branch information
ajoslin committed Oct 4, 2014
1 parent c19ca5d commit 4f7769a
Show file tree
Hide file tree
Showing 2 changed files with 23 additions and 8 deletions.
11 changes: 9 additions & 2 deletions src/components/sticky/_sticky.scss
Original file line number Diff line number Diff line change
Expand Up @@ -9,8 +9,15 @@
left: 0;
right: 24px;
position: absolute;
@include transform(translate3d(-9999px, -9999px, 0));
&.material-sticky-active {
display: none;

&.sticky-next,
&.sticky-prev,
&.sticky-active {
display: block;
@include transform(translate3d(-9999px, -9999px, 0));
}
&.sticky-active {
@include transform(translate3d(0, 0, 0));
}
}
Expand Down
20 changes: 14 additions & 6 deletions src/components/sticky/sticky.js
Original file line number Diff line number Diff line change
Expand Up @@ -224,19 +224,27 @@ function MaterialSticky($document, $materialEffects, $compile, $$rAF) {
function setCurrentItem(item) {
// Deactivate currently active item
if (self.current) {
self.current.clone.removeClass('material-sticky-active');
translate(self.current, null);
self.current.clone.removeClass('sticky-active');
self.next && self.next.clone.removeClass('sticky-next');
self.prev && self.prev.clone.removeClass('sticky-prev');
}

// Activate new item if given
if (item) {
item.clone.addClass('material-sticky-active');
item.clone.removeClass('sticky-next sticky-prev');
item.clone.addClass('sticky-active');
}

self.current = item;
var index = self.items.indexOf(item);
// If index === -1, index + 1 = 0. It works out.
self.next = self.items[index + 1];
self.prev = self.items[index - 1];
if (self.next = self.items[index + 1]) {
// If index === -1, index + 1 = 0. It works out.
self.next.clone.addClass('sticky-next');
}
if (self.prev = self.items[index - 1]) {
self.prev.clone.addClass('sticky-prev');
}
}

function translate(item, amount) {
Expand Down Expand Up @@ -296,7 +304,7 @@ function MaterialSticky($document, $materialEffects, $compile, $$rAF) {
element.triggerHandler('$scrollend');
} else {
element.triggerHandler('$scroll');
$$rAF(scrollEvent);
$$rAF(loopScrollEvent);
}
}
}
Expand Down

0 comments on commit 4f7769a

Please sign in to comment.