Skip to content

Using a Backdrop

The backdrop option is a boolean that represents whether the backdrop should be displayed or not per step. The backdrop is a semi-transparent overlay that covers the entire screen, except for the highlighted element.

Using the backdrop option

To enable the backdrop, you can use the backdrop option in the Step.

vue
<script setup>
  const steps = [{
    target: '[data-step=0]',
    content: 'Text Content',
    backdrop: true
  }];
</script>

INFO

You can enable the highlight effect globally by setting the backdrop prop in the VTour component.

See Documentation

Released under the MIT License.