title | layout | slug | priority | algolia |
---|---|---|---|---|
Events |
docs.html |
events |
4 |
true |
[[lead]]Glide.js comes with a rich collection of events that you can listen in order to run a custom logic at specific moments[[/lead]]
Use .on(event, handler)
method to assign your custom listeners.
Remember to declare your event listeners before calling
mount()
method.
var glide = new Glide('.glide')
glide.on('mount.before', function() {
// Handler logic ...
})
glide.mount()
You can also bind a single handler to multiple events using an array of names.
glide.on(['mount.before', 'run'], function() {
// Handler logic ...
})
Called before first mounting begins. However, the mounting phase has not been started, and components are not bootstrapped yet.
Called right after first mounting. All components have been mounted.
Called right after updating settings with update()
API method.
Called right after starting an instance with play()
API method.
Called right after stopping instance with pause()
API method.
Called right before setting up a slider to its initial state. At this point, classes, translations, and sizes are applied.
Called right after setting up a slider to its initial state. At this point, classes, translations, and sizes are applied.
Arguments:
{Object} move
Called right before calculating new index and making a transition. The movement schema (eg. =1
) string has been parsed.
Arguments:
{Object} move
Called right after calculating new index and before making a transition. The movement schema (eg. =1
) string has been parsed.
Arguments:
{Object} move
Called after calculating new index and making a transition. The movement schema (eg. =1
) string has been parsed.
Arguments:
{Object} move
Called after calculating new index and making a transition, while we did an offset animation. Offset animation take place at two moments:
- changing slide from first to the last one
- changing slide from last to the first one
Arguments:
{Object} move
Called right after calculating the new index, but before making a transition, while we did a rewinding to the start index.
Arguments:
{Object} move
Called right after calculating the new index, but before making a transition, while we did a rewinding to the last index.
Arguments:
{Number} movement
Called right before movement transition begins.
Arguments:
{Number} movement
Called right after movement transition ends.
Called when the window is being resized. This event throttled
Called right after swiping begins.
Called during swiping movement.
Called right after swiping ends.
Arguments:
{Number} movement
Called right before a translate applies, while we doing a jump to the first or last slide from offset movement. This event is only used when a type is set up to carousel
.