How can I link a button with a mega menu

Ask the community
, , ,
1

image
image1600×900 107 KB

Hey I got a question .I was trying to create a website and wanted to use a icon for mega menu instead of text only menu, i.e., I have a mega menu setup which opens on menu item hover. But I wanted to use a Icon instead of text.But after doing some research I found I can achieve it by Velo and tried the code I have given below.In the code I tried to link a Icon Button to a Mega menu.But it didn’t work. Note: I have also tried using Collapse & Expand instead of Show & Hide in the code.

Code:

/

/Menu
$w.onReady(function () {
    $w('#res-btn').onClick(() => {
        $w('#dropdownMenuRes').show(); // Show the element
		console.log("Executed");
    });
});
$w.onReady(function () {
    // Show the element with a "fade" effect on button hover
    $w("#res-btn").onMouseIn(() => {
        $w("#dropdownMenuRes").show("fade", { duration: 400 });
		console.log("Executed");
    });

    // Optionally hide the element when the mouse leaves the button
    $w("#res-btn").onMouseOut(() => {
        $w("#dropdownMenuRes").hide("fade", { duration: 400 });
		console.log("Executed");
    });
});

The console.log(); is used to see if in actual button is clicked or not.