Quiz

Quiz

new Quiz(element, options)

Source:
Parameters:
Name Type Description
element HTMLElement

DOM element for component instantiation and scope
options Object
Properties
Name Type Description
itemSelector String

Element used to trigger the animation
sliderSelector String

Root element of the slider
inputSelector String

Data attribute for the radio inputs
filppedClass String

Css class for the active dot element
textClass String

Css class of the element containing the text
frontClass String

Css class of the initially visible face of the card
backClass String

Css class of the initially hidden face of the card
prevClass String

Css class of the prev button
nextClass String

Css class of the next button
dotsClass String

Css class of the dots wrapper
dotClass String

Css class of the single dot
correctChosenOptionSelector string

Selector for correct option chosen
incorrectChosenOptionSelector string

Selector for incorrect option chosen
activeDotClass String

Css class to be assigned to the active dot
attachClickListener Boolean

Whether or not to bind click events
attachResizeListener Boolean

Whether or not to bind resize events
attachKeyboardListener Boolean

Whether or not to bind keyboard events

Classes

Quiz

Methods

checkHeight()

Description:

  • Check the height of the elements.

Source:

destroy()

Description:

  • Destroy component.

Source:

escapeSlider()

Description:

  • Moves the focus out of the slider when Escape is pressed.

Source:

handleClickOnItem(e)

Description:

  • Flips the card.

Source:
Parameters:
Name Type Description
e Event
Fires:

handleKeyboard()

Description:

  • Handle keyboard events for accessibility.

Source:

handleResize()

Description:

  • Trigger events on resize Uses a debounce, for performance

Source:

init()

Description:

  • Initialise component.

Source:

initSlider()

Description:

  • Init the slider.

Source:

on(eventName, callback) → {void}

Description:

  • Register a callback function for a specific event.

Source:
Example
// Registering a callback for the 'toggle' event
quiz.on('onClick', (event) => {
  console.log('Click event occurred!', event);
});
Parameters:
Name Type Description
eventName string

The name of the event to listen for.
callback function

The callback function to be invoked when the event occurs.
Returns:
Type
void

setCounter()

Description:

  • Sets the counter (in mobile).

Source:

trigger(eventName, eventData)

Description:

  • Trigger a component event.

Source:
Parameters:
Name Type Description
eventName string

The name of the event to trigger.
eventData any

Data associated with the event.

(static) autoInit(root) → {Quiz}

Source:
Parameters:
Name Type Description
root HTMLElement

DOM element for component instantiation and scope
Returns:

An instance of Quiz.

Type
Quiz

Events

onClick

Description:

  • An array of supported events for this component.

Source:
Type:
  • Array.<string>