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.
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!