Help with mega menu

Site URL: http://myessential.squarespace.com

Hello.

I am using this code to drag a footer in my folder in header to make a mega menu or more extended dropdown menu.

I am following instructions in youtube and here, but i am in a dead en, i will apreciate ur help

password to see website is      Elemento4

<script src="https://code.jquery.com/jquery-3.6.0.min.js" integrity="sha256-/xUj+3OJU5yExlq6GSYGSHk7tPXikynS7ogEvDej/m4=" crossorigin="anonymous"></script>
<script>
$(function(){
$('.header-display-desktop [href="/puebla"] + .header-nav-folder-content').append($('#footer-sections section:nth-of-type(2)'));
 });
</script>

9 minutes ago, adcj11 said:

Site URL: http://myessential.squarespace.com

Hello.

I am using this code to drag a footer in my folder in header to make a mega menu or more extended dropdown menu.

I am following instructions in youtube and here, but i am in a dead en, i will apreciate ur help

 

password to see website is      Elemento4

<script src="https://code.jquery.com/jquery-3.6.0.min.js" integrity="sha256-/xUj+3OJU5yExlq6GSYGSHk7tPXikynS7ogEvDej/m4=" crossorigin="anonymous"></script>
<script>
$(function(){
$('.header-display-desktop [href="/puebla"] + .header-nav-folder-content').append($('#footer-sections section:nth-of-type(2)'));
 });
</script>

You missing the style part, did the instruction provide it? The menu actually moved to correct place

Yes

It was the style, and the word Puebla instead of destinations.

Thanks a lot.

Is been a rough path trough the legendary mega menu

32 minutes ago, bangank36 said:

You missing the style part, did the instruction provide it? The menu actually moved to correct place

Can you help me, how can I changue the background color box by transparent value?

.header-display-desktop [href="/destinations"] +
.header-nav-folder-content{
  width:30vw;
position:absolute;
box-sizing:border-box;
  right:-0 !important;
  left:-10 !important;
  padding: 23px;
  border-botom: 0px solid;
  }

I had been using this but the menu still not aligned and black in the background.

23 minutes ago, adcj11 said:

Can you help me, how can I changue the background color box by transparent value?

.header-display-desktop [href="/destinations"] +
.header-nav-folder-content{
  width:30vw;
position:absolute;
box-sizing:border-box;
  right:-0 !important;
  left:-10 !important;
  padding: 23px;
  border-botom: 0px solid;
  }

 

I had been using this but the menu still not aligned and black in the background.

try

.header-nav-list .page-section .section-background {
  background-color: #000000;
}

It worked, I am going to put a transparency.

Thanks a lot again!

Can you help me to erase or not have this thick borders in the navigation box? I mean dissapear them

On 4/13/2021 at 9:08 AM, adcj11 said:

Can you help me to erase or not have this thick borders in the navigation box? I mean dissapear them

 

Add to Design > Custom CSS

/* remove folder black border */
.header-nav-folder-content {
    background-color: transparent !important;
    border: none !important;
}

On 4/14/2021 at 3:17 AM, tuanphan said:

Add to Design > Custom CSS

/* remove folder black border */
.header-nav-folder-content {
    background-color: transparent !important;
    border: none !important;
}

 

I added, but now the background is full black, I would like to appear as the original design in the footer is before aply the mega menu code. Like the pic behind still looking in a transparency or just stay like the original design.

On 4/22/2021 at 5:08 AM, adcj11 said:

 

I added, but now the background is full black, I would like to appear as the original design in the footer is before aply the mega menu code. Like the pic behind still looking in a transparency or just stay like the original design.

Can you send original design?