2.0.2 • Published 1 year ago
frontello-ui-stepper v2.0.2
Stepper
Define dynamicly step states (done, current or todo).
Header
<script src="stepper.js"></script>
<link rel="stylesheet" href="stepper.css">
Body
<nav class="frontello-ui-stepper"></nav>
<script>
document.addEventListener('DOMContentLoaded', () => {
let stepperElement = document.querySelector('.frontello-ui-stepper');
stepperElement.addEventListener('init', (event) => {
console.log('stepper: init');
console.log(event.detail);
}, false);
stepperElement.addEventListener('change', (event) => {
console.log('stepper: change');
console.log(event.detail);
}, false);
let stepper = new Stepper(stepperElement);
stepper.setStepList([
'Lorem ipsum dolor sit amet',
'Duis aute irure dolor',
'Ut enim ad minim veniam'
]);
stepper.setCurrentStep(2);
});
</script>