14
Views
1
Comments
Solved
[DriverJS] Restricting user interaction, clicks on the background of driverjs  component
Question
driverjs
Reactive icon
Forge asset by Guillaume Henriques
Application Type
Mobile
Service Studio Version
11.55.18 (Build 64106)

We are currently working on restricting user interactions ,specifically clicks on both the background and highlighted components of Driver Js component,once the driver has been initiated. However, we have been unable to achieve the desired functionality. We have implemented the JavaScript code provided below(Click restricting on background  ), but it has not resolved the issue. Your assistance in identifying and addressing the problem would be greatly appreciated. 



image (17).png
image (16).png
Shipments - Google Chrome 2025-04-21 07-40-49.zip
2026-03-12 10-32-06
Wahaj Adil
Solution

Hi @Hema G , hope you're doing fine.

try implementing the following Js code and check;


let driverIsActive = false;


const driver = new Driver ({
   allowClose : False,
   allowClose: false,
   overlayClickNext: false,
   stageClickNext: false,
   disableActiveInteraction: true,
   onHighlightStarted: () => { driverIsActive = true },
   onReset: () => { driverIsActive = false },
   onDeselected: () => { driverIsActive = false },
});

driver.defineSteps([
  {
    element: '#myElement',
    popover: {
       title: 'Step Title',
       description: 'Step Description',
       position: 'bottom'
      }
  }
]);

driver.start();
document.addEventListener("click", function(e) {
     if (driverIsActive) {
     e.stopPropagation();
     e.preventDefault();
     console.log("Click blocked during Driver.js tour");
   }
}, true); 


Hope this addresses the issue, please feel free to reach out if you encounter any further problems or need additional assistance.

Thanks and Regards!








Community GuidelinesBe kind and respectful, give credit to the original source of content, and search for duplicates before posting.