When the skyline element is in visible part of the document, starts animation to show it.
Don't forget to add animation classes to your skyline elements.
![]()
...
skylines = document.querySelectorAll("[data-spy='skyline']") for sky in skylines sky.skyline delay: -> 2000 * Math.random()
Let's change animation to -newspaper--
.
![]()
...
skylines = document.querySelectorAll("[data-spy='skyline']") for sky in skylines sky.skyline delay: -> 2000 * Math.random()
Name | Default | Description |
---|---|---|
spy | @el.getAttribute( 'data-spy' ) or 'skyline' | Set toggle type of the element. |
offset | @el.getAttribute( 'data-offset' ) or 5 |
Number . Vertical offset to start showing scrollspy elements before or after they are visible.
|
delay | @el.getAttribute( 'data-delay' ) or 300 |
Number or Function , returning number. Delay before showing.
|
once | @el.getAttribute( 'data-once' ) or no |
Boolean , show just once and don't hide element anymore.
|
onMobile | @el.getAttribute( 'data-on-mobile' ) or no | Stop Skyline plugin on mobile devices. |
Method | Description |
---|---|
activate |
Activate current skyline element. |
deactivate |
Deactivate current skyline element. |
start |
Start listening scroll events. |
stop |
Stop listening scroll effects. |
refresh |
Refresh sizes and position of the skyline element. |
Inside each method to get skyline use@
orthis
in js. Class instance always stores in data attribute of the skyline element@data['kitSkyline']
orthis.data['kitSkyline']
in js.
Event | Description |
---|---|
beforeactive |
Set a function to call it before start skyline. If it returns skylines = document.querySelectorAll(".radio-with-before") for btn in skylines beforeactive: -> d = $.Deferred() skyline = @data['kitSkyline'] skyline._addClass '_disabled_' setTimeout -> d.resolve() ,2000 d.promise() onactive: -> skyline = @data['kitSkyline'] skyline._removeClass '_disabled_' beforedeactive: -> d = $.Deferred() skyline = @data['kitSkyline'] skyline._addClass '_disabled_' setTimeout -> d.resolve() ,3000 d.promise() ondeactive: -> skyline = @data['kitSkyline'] skyline._removeClass '_disabled_' |
onactive |
Set a function to call it after skyline start. |
failactive |
Set a function to call it if start failed. |
beforedeactive |
Call this function before stop skyline. |
ondeactive |
Call this function after stop skyline. |
faildeactive |
Set a function to call it if stop failed. |