Navigation

If you use the DeckDeckGo starter kit, the navigation methods are already bind out of the box.

However, if you wish to know more about the different options or are using the core of DeckDeckGo, the DeckDeckGo deck exposes the following asynchronous methods in case you would like to add navigation features to your project.

Introduction

In the following examples we are accessing the features available on the deck element <deckgo-deck>.

For example, in Vanilla Javascript, we would get a reference to the deck using the following selector:

const deck = document.getElementsByTagName('deckgo-deck');

Go to next slide

await deck.slideNext();

Optional parameters

ParameterTypeDefaultDescription
slideAnimationbooleantrueSet to false in case you would not like the inner animation of a slide, like the reveal or code animation for example, to be performed.
emitEventbooleantrueSet to false in case you would not like the events slideNextDidChange and slidePrevDidChange to be fired. Note that to use this parameter, the previous should be set too.

For example:

await deck.slideNext(false, false);

Go to previous slide

await deck.slidePrev();

Optional parameters

ParameterTypeDefaultDescription
slideAnimationbooleantrueSet to false in case you would not like the inner animation of a slide, like the reveal or code animation for example, to be performed.
emitEventbooleantrueSet to false in case you would not like the events slideNextDidChange and slidePrevDidChange to be fired. Note that to use this parameter, the previous should be set too.

For example:

await deck.slidePrev(false, false);

Go to a specific slide

await deck.slideTo(0); // parameters: index: number, speed?: number | undefined

Parameters

ParameterTypeDefaultDescription
indexnumberSlide index of the specific slide.
speednumber300The slide transition speed. Default 300ms.
emitEventbooleantrueIn case you would not like to emit the event slideToChange. Note that if you would use this parameter, the above speed parameter must be provided too.

Is the deck at the begin

await deck.isBeginning(); // resolve a boolean

Is the deck at the end

await deck.isEnd(); // resolve a boolean

Get the index of the current slide

await deck.getActiveIndex(); // resolve a number

Get the length of the deck

await deck.getLength(); // resolve a number

Block or unblock the slide

await deck.blockSlide(block: boolean);

Delete the active slide

await deck.deleteActiveSlide();