JS Events

Ghost Kit provides JS events for different dynamic blocks. Usage example:

document.addEventListener('init.blocks.gkt', function(event) {
  console.log( event );
})
document.addEventListener('show.accordion.gkt', function( event ) {
  console.log( event, event.relatedTarget );
})

General Events

EventParams
init.gktevent
init.blocks.gktevent

Block Events

Accordion

EventParams
prepare.accordion.gktevent.target
prepared.accordion.gktevent.target
hide.accordion.gktevent.target
event.relatedTarget
hidden.accordion.gktevent.target
event.relatedTarget
show.accordion.gktevent.target
event.relatedTarget
shown.accordion.gktevent.target
event.relatedTarget

Alert

EventParams
close.alert.gktevent.target
closed.alert.gktevent.target
EventParams
init.carousel.gktevent.target
event.options
inited.carousel.gktevent.target
event.options
touchStart.carousel.gktevent.target
event.originalEvent
touchMove.carousel.gktevent.target
event.originalEvent
touchEnd.carousel.gktevent.target
event.originalEvent

Changelog

EventParams
prepare.changelog.gktevent.target
prepared.changelog.gktevent.target

Countdown

EventParams
prepare.countdown.gktevent.target
prepared.countdown.gktevent.target

Gist

EventParams
prepare.gist.gktevent.target
event.options
prepared.gist.gktevent.target
event.options

Google Maps

EventParams
prepare.googleMaps.gktevent.target
event.options
prepared.googleMaps.gktevent.target
event.options
event.instance

Image Compare

EventParams
move.imageCompare.gktevent.target
event.originalEvent
EventParams
update.interactive-link.gktevent.relatedTarget
event.config
show.interactive-link.gktevent.relatedTarget
event.config
showed.interactive-link.gktevent.relatedTarget
event.config
hide.interactive-link.gktevent.relatedTarget
event.config
hidden.interactive-link.gktevent.relatedTarget
event.config

Marquee

EventParams
prepare.marquee.gktevent.target
prepared.marquee.gktevent.target

Tabs

EventParams
prepare.tabs.gktevent.target
prepared.tabs.gktevent.target
show.tab.gktevent.target
event.relatedTarget
shown.tab.gktevent.target
event.relatedTarget
hide.tab.gktevent.target
event.relatedTarget
hidden.tab.gktevent.target
event.relatedTarget

Video

EventParams
prepare.video.gktevent.target
prepared.video.gktevent.target
prepare.videoWorker.gktevent.target
event.options
prepared.videoWorker.gktevent.target
event.api
prepare.videoObserver.gktevent.target
event.config

Core List

EventParams
prepare.numberedList.gktevent.target

Extensions

Effects

EventParams
prepare.effects.gktevent.target
event.data
prepare.effects.reveal.gktevent.target
event.config
prepared.effects.reveal.gktevent.target
event.config
showed.effects.reveal.gktevent.target
event.config
event.keyframes
event.options
event.stopInView
event.leaveCallback
showed.effects.reveal.gktevent.target
event.config
event.keyframes
event.options
event.stopInView
event.leaveCallback
prepare.effects.reveal-pro.gktevent.target
event.config
event.keyframes
event.options
show.effects.reveal-pro.gktevent.target
event.config
event.keyframes
event.options
showed.effects.reveal-pro.gktevent.target
event.config
event.keyframes
event.options
hide.effects.reveal-pro.gktevent.target
event.config
event.keyframes
event.options
hidden.effects.reveal-pro.gktevent.target
event.config
event.keyframes
event.options
prepare.effects.loop.gktevent.target
event.config
prepared.effects.loop.gktevent.target
event.config
prepare.effects.mouseHover.gktevent.target
event.config
event.originalEvent
prepared.effects.mouseHover.gktevent.target
event.config
event.originalEvent
update.effects.mouseMove.gktevent.target
event.keyframes
event.options
event.config
prepare.effects.mousePress.gktevent.target
event.config
event.originalEvent
prepared.effects.mousePress.gktevent.target
event.config
event.originalEvent
update.effects.scroll.gktevent.target
event.keyframes
event.options
event.config

Counter

EventParams
prepare.counter.gktevent.target
event.config
count.counter.gktevent.target
event.config
counted.counter.gktevent.target
event.config
Was this page helpful?