@givemeawhisky
Thank you for your reply
Here is a recap again about what I have:
There are 5 buttons for the menu bar
Home About Features Solutions Contact us
Features and Solutions has their own drop down box for sub menus
Contact us is a different design than the rest (eyecatcher for CTA)
Element with the word “select” in their name is the button that is highlighted after hovering the button to click.
(before when I put the onReady code, I get an error)
All buttons on the setting are set as “none”. So no linking to anything.
What does not work: the links to the pages.
First part of the code is the URL linking
Second part of the code is the two drop down boxes
Third part of the code is the buttons while hovering and clicking, etc.
import wixLocation from ‘wix-location’;
export function HomeMenubselect_onclick(event) {
//Add your code for this event here:
wixLocation.to(“/home”);
}
export function AboutMenubselect_onclick(event) {
//Add your code for this event here:
wixLocation.to(“/about-us”);
}
export function BlogMenubselect_onclick(event) {
//Add your code for this event here:
wixLocation.to(“/blog”);
}
export function ContactMenubselect_onclick(event) {
//Add your code for this event here:
wixLocation.to(“/contact”);
}
export function HomeMenub_onMouseIn(event) {
//Add your code for this event here:
$w(‘#Featurebox’).hide();
$w(‘#Solutionbox’).hide();
}
export function HomeMenubselect_onMouseIn(event) {
//Add your code for this event here:
$w(‘#Featurebox’).hide();
$w(‘#Solutionbox’).hide();
}
export function AboutMenub_onMouseIn(event) {
//Add your code for this event here:
$w(‘#Featurebox’).hide();
$w(‘#Solutionbox’).hide();
}
export function AboutMenubselect_onMouseIn(event) {
//Add your code for this event here:
$w(‘#Featurebox’).hide();
$w(‘#Solutionbox’).hide();
}
export function Featuresbutton_onmouseIn(event) {
//Add your code for this event here:
$w(‘#Featurebox’).show();
$w(‘#Solutionbox’).hide();
$w(‘#Featuresbuttonselect’).show();
}
export function Featuresbuttonselect_onmouseIn(event) {
//Add your code for this event here:
$w(‘#Featurebox’).show();
$w(‘#Solutionbox’).hide();
$w(‘#Featuresbuttonselect’).show();
}
export function Featurebox_onmouseOut(event) {
//Add your code for this event here:
$w(‘#Featurebox’).hide();
}
export function Solutionsbutton_onmouseIn(event) {
//Add your code for this event here:
$w(‘#Solutionbox’).show();
$w(‘#Featurebox’).hide();
$w(‘#Solutionsbuttonselect’).show();
}
export function Solutionsbuttonselect_onmouseIn(event) {
//Add your code for this event here:
$w(‘#Solutionbox’).show();
$w(‘#Featurebox’).hide();
$w(‘#Solutionsbuttonselect’).show();
}
export function Solutionbox_onmouseOut(event) {
//Add your code for this event here:
$w(‘#Solutionbox’).hide();
}
export function BlogMenub_onMouseIn(event) {
//Add your code for this event here:
$w(‘#Featurebox’).hide();
$w(‘#Solutionbox’).hide();
}
export function BlogMenubselect_onMouseIn(event) {
//Add your code for this event here:
$w(‘#Featurebox’).hide();
$w(‘#Solutionbox’).hide();
}
export function ContactMenub_onMouseIn(event) {
//Add your code for this event here:
$w(‘#Featurebox’).hide();
$w(‘#Solutionbox’).hide();
}
export function ContactMenubselect_onMouseIn(event) {
//Add your code for this event here:
$w(‘#Featurebox’).hide();
$w(‘#Solutionbox’).hide();
}
export function HomeMenub_onclick(event) {
//Add your code for this event here:
$w(‘#HomeMenubselect’).show();
$w(‘#AboutMenubselect’).hide();
$w(‘#Featuresbuttonselect’).hide();
$w(‘#Solutionsbuttonselect’).hide();
$w(‘#BlogMenubselect’).hide();
$w(‘#ContactMenubselect’).hide();
}
export function AboutMenub_onclick(event) {
//Add your code for this event here:
$w(‘#HomeMenub’).show();
$w(‘#AboutMenubselect’).show();
$w(‘#Featuresbuttonselect’).hide();
$w(‘#Solutionsbuttonselect’).hide();
$w(‘#BlogMenubselect’).hide();
$w(‘#ContactMenubselect’).hide();
}
export function Featuresbutton_onclick(event) {
//Add your code for this event here:
$w(‘#HomeMenub’).show();
$w(‘#AboutMenubselect’).hide();
$w(‘#Featuresbuttonselect’).show();
$w(‘#Solutionsbuttonselect’).hide();
$w(‘#BlogMenubselect’).hide();
$w(‘#ContactMenubselect’).hide();
}
export function Solutionsbutton_onclick(event) {
//Add your code for this event here:
$w(‘#HomeMenubselect’).hide();
$w(‘#AboutMenubselect’).hide();
$w(‘#Featuresbuttonselect’).hide();
$w(‘#Solutionsbuttonselect’).show();
$w(‘#BlogMenubselect’).hide();
$w(‘#ContactMenubselect’).hide();
}
export function BlogMenub_onclick(event) {
//Add your code for this event here:
$w(‘#HomeMenubselect’).hide();
$w(‘#AboutMenubselect’).hide();
$w(‘#Featuresbuttonselect’).hide();
$w(‘#Solutionsbuttonselect’).hide();
$w(‘#BlogMenubselect’).show();
$w(‘#ContactMenubselect’).hide();
}
export function ContactMenub_onclick(event) {
//Add your code for this event here:
$w(‘#HomeMenubselect’).hide();
$w(‘#AboutMenubselect’).hide();
$w(‘#Featuresbuttonselect’).hide();
$w(‘#Solutionsbuttonselect’).hide();
$w(‘#BlogMenubselect’).hide();
$w(‘#ContactMenubselect’).show();
}
Here is a mini video of how it looks
Hopefully this gives you a clear idea.
Thank you again for your help