hlStickyElementCollection
Container for hlStickyElement
instances. The service is a function and you need to make an instance to use it.
To-write: - uses 1 stack - provider - same name returns same object
var stickyElementCollectionInstance = hlStickyElementCollection(options:object); stickyElementCollectionInstance.addElement(element:DOMElement, options:object); stickyElementCollectionInstance.removeElement(element:DOMElement,string); stickyElementCollectionInstance.draw(drawOptions:object); stickyElementCollectionInstance.trackedElements(); stickyElementCollectionInstance.destroy(force);
hlStickyElementCollection(options:object)
options
An object with a bunch of options that determine the behavior of the sticky element collection:
name
(Default: 'default-stack') - The name of the collection.
This is required if you want more than one collection on a page because you'll be using this name at the parent
option.
parent
(Default: none) - Parent collection name.
If you're using more than one collection on a single page and those collection need to stacked on top of each other.
Once you have an instance a few methods are made available to you.
addElement(element:DOMElement, options:object)
Adds a DOM element object that will become sticky and part of the collection.
The documentation for both the element
and the options
parameters can be found at the hlStickyElement
service documentation.
removeElement(element:DOMElement|string)
element
The DOMElement of the sticky element you want to remove.
It can either be an DOMElement or a string which looks for an element's id.
draw(drawOptions:object)
Draws all the sticky elements in the collection at once.
For documentation for the drawOptions
read the documentation from the hlStickyElement
service.
But because this collection does some work for you, the offset parameters top
, bottom
and zIndex
will be taken care of if a collection parent has been set.
trackedElements()
Returns the raw sticky elements array used in the collection. You probably should leave this alone if you're not sure what to do with this.
destroy()
Destroys all sticky elements from the collection and from the stack and it makes sure all sticky element un-stick themselves. It is vital you call this method after you for example switch pages in your Angular application, otherwise it might cause weird artifacts on follow up pages.