SheFund Template Menu Style - Question | JoomShaper
Black Friday sale is live with flat 50% OFF. Sale ends soon! Grab your deal now!
Back to the questions

SheFund Template Menu Style

J

Julien

Template 3 years ago

Hi,

Is it possible to reproduce the main menu hover style of "SheFund" template for basic template created with Helix latest framework ?

Try it but without success.

Thanks

0
3 Answers
Order by
Oldest Newest Votes
Paul Frankowski
Paul Frankowski
Accepted Answer
Senior Staff 3 years ago #81830

Hi Julien,

yes, it's just a CSS, not php code. Example code , it should work

.sp-megamenu-parent .sp-menu-item a:before {
 content:"";
 width:0;
 height:2px;
 background-color:#3b4555;
 display:inline-block;
 position:absolute;
 bottom:32px;
 opacity:0;
 visibility:hidden;
 transition:all .3s ease
}
.sp-megamenu-parent .sp-menu-item a:hover:before {
 width:20px;
 opacity:1;
 visibility:visible}

.sp-megamenu-parent .sp-menu-item.current-item a:before {
 width:20px;
 opacity:1;
 visibility:visible
}
.sp-dropdown .sp-menu-item a:before {
 width:20px;
 bottom:5px;
 left:0}
0
J
Julien
Accepted Answer
3 years ago #81832

Yes many thanks, two small remarks :

  • for the last child of a dropdown menu item the border bottom seems to be 1px higher than the css code (3px I think instead of 2px)
  • is it possible to have the ease transition for the dropdown menu items ?

Best regards

0
Paul Frankowski
Paul Frankowski
Accepted Answer
Senior Staff 3 years ago #81835

CSS code customization is on your hands only.

Probably yes, but forum is not for adding a new features to Helix framework.

You have to use that class for adding extra/custom animation effect

.sp-megamenu-parent .sp-has-child:hover>.sp-dropdown { }

0