Overlay value of styles passed dynamically

Asked

Viewed 19 times

0

I’m using the jquery superfish to make some optimizations in a menu. This plugin passes the value display:none or block for the element sub-menu

That way:

<ul class="sub-menu" style="display:none"> </ul>

What I’d like to do now is, overlay with javascript the value of this display at a specific level of that menu. Specifically at level 3.

.nav ul li ul.sub-menu li .ul.sub-menu2 li ul.sub-menu3{}

Thus:

<ul class="sub-menu" style="display:none"> <ul class="sub-menu2" style="display:none"> <ul class="sub-menu3" style="display:none"> </ul> </ul> </ul>

I want to replace the none by inline-block no sub-menu3

DEMO: https://superfish.joelbirch.co/examples/

  • @dvd how should we do? See, this worked out the way I expected. I would like to do the same, but with DOM, and if it were possible not to change, but simply remove the value soon. $('.priority-nav ul li.full-menu-col ul.sub-menu li.has-children > ul.sub-menu').css('display', 'inline-block')

  • @dvd, I am aware that I could solve this with a simple !important in my file . css but...

  • @dvd I used this sub-menu3 class to exemplify where I would like to remove.

  • Not to use through the same hierarchy in jquery? I noticed that with jquery there is a delay, and also the None display comes back when Hover.

  • I don’t use div, only ul.

  • You can select the 3rd ul like this: document.querySelector('ul ul ul');

Show 1 more comment
No answers

Browser other questions tagged

You are not signed in. Login or sign up in order to post.