PRO: dropdown content element canvas and active menut item show all active

Hi there!

I am on the latest PRO version 1.26 i believe it is.
I added a dropdown content element to my homepage and added a shortcode for essential grid. That works OK but not 100% yet. As you can see in the screenshot the canvas which comes from the dropdown content element doesn’t content the essential grid gallery. I would like to adapt the size of the canvas to be much larger and appear “behind” the whole essential grid . something like autosize follow the ess. grid.
That would also clear the issue of transparency between the essential images…
I hope you get what I want to explain :slight_smile: otherwise let me know please :wink:

My 2nd issue is about the navigation menu.
As you can see on the Screenshot, it sometimes shows that all item of a menu/submenu are active at the same time…
That is not how it was supposed to be :wink:

Do you think it could have something to do with this snippet which I found in an old post?
Is there something wrong with the code? Thank you very much!

setInterval(  function() {
jQuery( '.current-menu-item a' ).each( function() {
 
jQuery(this).addClass('x-interactive');
jQuery(this).parent().find('a > span > span').addClass('x-active');
 
} ); }, 300);

Hi there,

I have checked the homepage on the dashboard and unfortunately, I should say that the Content Area element is not designed for that kind of usage. You can not have the Javascript dependent elements regarding the sizing of the content area. The functionality is meant to have simple text or images.

Actually, it is not recommended to even add the Essential Grids to Sliders or Accordions or tabs, or any element that is not showing at the beginning.

Essential Grids is heavily depending on the calculation of the height using Javascript and if the element is hidden initially the calculation goes wrong and the whole thing is ruined. I added a test page, added an accordion and the same grid you have mentioned inside and you can see the broken view in the Secure Note.

Unfortunately, the only suggestion we can give is that you should not use the Essential Grid inside such elements, just add it there on the homepage by itself.

Regarding the second question, whenever you see such a behavior you need to suspect that a Javascript code somewhere on that specific page throws an error, that prevents the rest of the Javascript of the page work and you will have abnormal stuff for the menu or even sometimes other Javascript heavy elements.

I suggest that you check your code with the Javascript checking tools such as:

http://www.jslint.com/

Thank you.

hello,
to be honest your answers are quite disappointing to me. (2 questions and not even one solution)

Is it not even possible to specify the content canvas size?
Or just make it transparent?

Or do you have another solution for a “dropdown”- area like on my other page
there is a drop down for “more options” but it comes from a plugin. Do you have a solution to implement something like this?

thank you for looking at this again

Hi There,

Background and size can be adjusted on the following settings of the element:

That more options part is not available out of the box. It is possible by adding a button element then hiding the section by default. On click of a button, a jquery function should trigger the toggle function. See this guide:
https://www.w3schools.com/jquery/tryit.asp?filename=tryjquery_hide_show. If you are not familiar with coding this, I would recommend to consult a developer as this would be custom development. Thank you for understanding.

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.