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

Commit

Permalink
Merge pull request #23 from leonex-cstoller/clone_affix
Browse files Browse the repository at this point in the history
Refreshed the Readme so that it reflects changes of PR #22
  • Loading branch information
mg committed Nov 9, 2015
2 parents e2df766 + 08c9f7f commit 39efff2
Show file tree
Hide file tree
Showing 5 changed files with 31 additions and 31 deletions.
10 changes: 5 additions & 5 deletions README.md
Original file line number Diff line number Diff line change
Expand Up @@ -111,18 +111,18 @@ The class *affixed* will be added to the class once it reaches the bottom edge o

Possible values for *affix* are *top*, *bottom*, *left* and *right*.

#### More fluent passage by *cloning*
#### More fluent passage by adding a *placeholder*
In default mode the element which should be affixed is just set to *position fixed*.
As this will pull the element out of its normal flow, the elements below will be
moved up with a jolt.

If you add `{clone: true}` to the affix options the original element will be cloned,
the clone gets inserted after its origin and set to *position fixed*, so that you
If you add `{placeholder: true}` to the affix options the original element will be cloned
and the clone gets inserted after its origin to serve as a placeholder, so that you
won't see any flickering effects.

<div affix affix-options="{clone: true}">Affixed!</div>
<div affix affix-options="{placeholder: true}">Affixed!</div>

The default of the option `clone` is `false`.
The default of the option `placeholder` is `false`.

### The pagemenu and pageitems directives
The module provides two directives, *pageitems* attribute and *<pagemenu>* tag. The *pageitems* tag will parse the included HTML and query for items with a certain class. The menu will then be generated in the DOM where you put the *<pagemenu>* tag from that list of items.
Expand Down
18 changes: 9 additions & 9 deletions dist/ngScrollSpy.debug.js
Original file line number Diff line number Diff line change
Expand Up @@ -199,25 +199,25 @@ mod.service('ScrollSpy', function($window) {
});
mod.directive('affix', function(ScrollSpy) {
var affixCloneFn= function(elem) {
if (!elem.data('$ngScrollSpy.clone')) {
var clone = elem.clone();
elem.data('$ngScrollSpy.clone', clone);
if (!elem.data('$ngScrollSpy.placeholder')) {
var placeholder = elem.clone();
elem.data('$ngScrollSpy.placeholder', placeholder);
}
return elem.data('$ngScrollSpy.clone');
return elem.data('$ngScrollSpy.placeholder');
};

var affixFn= function(shouldAffixFn, wasAffixed, affixClass, affixOptions, elem) {
var shouldAffix= shouldAffixFn(elem[0].getBoundingClientRect());
if(shouldAffix !== wasAffixed) {
if(shouldAffix) {
if(affixOptions.clone) {
// insert cloned element into DOM, so that it replaces the element,
// that will be pulled out of the flow.
if(affixOptions.placeholder) {
// insert cloned element into DOM to serve as a placeholder,
// because the original element (elem) will be pulled out of the flow by getting affixed
elem.after(affixCloneFn(elem));
}
elem.addClass(affixClass);
} else {
if(affixOptions.clone) {
if(affixOptions.placeholder) {
// remove clone from DOM again
affixCloneFn(elem).detach();
}
Expand All @@ -233,7 +233,7 @@ mod.directive('affix', function(ScrollSpy) {
affixedPos,
trigger= false;

affixOptions = angular.extend({offset: 0, clone: false}, affixOptions);
affixOptions = angular.extend({offset: 0, placeholder: false}, affixOptions);

if(affixTo === 'top') {
scrollHandler= ScrollSpy.onYScroll(function(pos) {
Expand Down
18 changes: 9 additions & 9 deletions dist/ngScrollSpy.js
Original file line number Diff line number Diff line change
Expand Up @@ -199,25 +199,25 @@ mod.service('ScrollSpy', function($window) {
});
mod.directive('affix', function(ScrollSpy) {
var affixCloneFn= function(elem) {
if (!elem.data('$ngScrollSpy.clone')) {
var clone = elem.clone();
elem.data('$ngScrollSpy.clone', clone);
if (!elem.data('$ngScrollSpy.placeholder')) {
var placeholder = elem.clone();
elem.data('$ngScrollSpy.placeholder', placeholder);
}
return elem.data('$ngScrollSpy.clone');
return elem.data('$ngScrollSpy.placeholder');
};

var affixFn= function(shouldAffixFn, wasAffixed, affixClass, affixOptions, elem) {
var shouldAffix= shouldAffixFn(elem[0].getBoundingClientRect());
if(shouldAffix !== wasAffixed) {
if(shouldAffix) {
if(affixOptions.clone) {
// insert cloned element into DOM, so that it replaces the element,
// that will be pulled out of the flow.
if(affixOptions.placeholder) {
// insert cloned element into DOM to serve as a placeholder,
// because the original element (elem) will be pulled out of the flow by getting affixed
elem.after(affixCloneFn(elem));
}
elem.addClass(affixClass);
} else {
if(affixOptions.clone) {
if(affixOptions.placeholder) {
// remove clone from DOM again
affixCloneFn(elem).detach();
}
Expand All @@ -233,7 +233,7 @@ mod.directive('affix', function(ScrollSpy) {
affixedPos,
trigger= false;

affixOptions = angular.extend({offset: 0, clone: false}, affixOptions);
affixOptions = angular.extend({offset: 0, placeholder: false}, affixOptions);

if(affixTo === 'top') {
scrollHandler= ScrollSpy.onYScroll(function(pos) {
Expand Down
2 changes: 1 addition & 1 deletion dist/ngScrollSpy.min.js

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

14 changes: 7 additions & 7 deletions src/affix.js
Original file line number Diff line number Diff line change
@@ -1,24 +1,24 @@
mod.directive('affix', function(ScrollSpy) {
var affixCloneFn= function(elem) {
if (!elem.data('$ngScrollSpy.clone')) {
var clone = elem.clone();
elem.data('$ngScrollSpy.clone', clone);
if (!elem.data('$ngScrollSpy.placeholder')) {
var placeholder = elem.clone();
elem.data('$ngScrollSpy.placeholder', placeholder);
}
return elem.data('$ngScrollSpy.clone');
return elem.data('$ngScrollSpy.placeholder');
};

var affixFn= function(shouldAffixFn, wasAffixed, affixClass, affixOptions, elem) {
var shouldAffix= shouldAffixFn(elem[0].getBoundingClientRect());
if(shouldAffix !== wasAffixed) {
if(shouldAffix) {
if(affixOptions.clone) {
if(affixOptions.placeholder) {
// insert cloned element into DOM to serve as a placeholder,
// because the original element (elem) will be pulled out of the flow by getting affixed
elem.after(affixCloneFn(elem));
}
elem.addClass(affixClass);
} else {
if(affixOptions.clone) {
if(affixOptions.placeholder) {
// remove clone from DOM again
affixCloneFn(elem).detach();
}
Expand All @@ -34,7 +34,7 @@ mod.directive('affix', function(ScrollSpy) {
affixedPos,
trigger= false;

affixOptions = angular.extend({offset: 0, clone: false}, affixOptions);
affixOptions = angular.extend({offset: 0, placeholder: false}, affixOptions);

if(affixTo === 'top') {
scrollHandler= ScrollSpy.onYScroll(function(pos) {
Expand Down

0 comments on commit 39efff2

Please sign in to comment.