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

Commit

Permalink
Refreshed the readme so that it reflects the current behaviour and us…
Browse files Browse the repository at this point in the history
…ing 'placeholder' as identifier for the clone
  • Loading branch information
leonex-cs1 committed Aug 13, 2015
1 parent 85acad1 commit 08c9f7f
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 @@ -109,18 +109,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 08c9f7f

Please sign in to comment.