[Resolved] Hide element settings on custom screen resolution

Home Forums Support Hide element settings on custom screen resolution

Viewing 6 posts - 1 through 6 (of 6 total)
  • Author
    Posts
  • #1432528
    Eeva Lamminen

    Hi,

    I’m developing a woocommerce website that is using a hero Element on desktop. I have an issue with mobile menu transparency on tablet size screens that seems to be related to the element settings on specific screen size.

    On desktop I’m using a transparent menu, colors etc. based on the settings I’ve made to the element. The menu changes into normal sticky menu with white background (+ etc. settings I’ve given in Customizer) menu when scrolling down. Sticky menu works as it should overall. So all this is fine on desktop.

    Mobile menu breakpoint is set to 1025px in Customizer and that also works as it should, the mobile menu is used according to this setting.

    The issue is the change into mobile menu on tablet and on smaller laptop screens. In this screen size the menu is still transparent even though I’ve set the hero element to be hidden on all screens under 1025px. The hero element has css class hideonmobile.

    @media (max-width: 1025px) {
        .page-hero.hideonmobile {
            display: none;
        }

    I’d need the mobile menu to have a white background (and using the other normal menu settings I’ve given it in Customizer) already on screens under 1025px but above 768px.

    The menu works on screens under 768px as I’ve set it to work, with a white background.

    To me it seems that the hero element is somehow overriding the mobile menu settings on this particular screen size.

    I’m using GP Premium 1.11.3 and Elementor 3.0.5 and Elementor Pro 3.0.3. Unfortunately my website is in development stage and thus hidden. I can provide user details in private if needed.

    Can you give me any tips on how to solve this?

    Thanks already in advance!

    #1432761
    David
    Staff
    Customer Support

    Hi there,

    would you be able to provide us a Login or remove the coming soon so i can take a look?

    You can send the Login details via the Account Issue form:

    https://generatepress.com/contact/

    Please include the URL for this topic.

    #1433693
    Eeva Lamminen

    Hi David,
    I sent you the credentials with the account form.

    #1434270
    Tom
    Lead Developer
    Lead Developer

    Hi there,

    The page hero checks to see if we’re not on mobile when using the desktop merge option.

    Try adding this filter:

    add_filter( 'generate_not_mobile_media_query', function() {
        return '(min-width: 1025px)';
    } );

    Let me know 🙂

    #1435223
    Eeva Lamminen

    Hello,
    The filter solved the problem.
    Thank you very very much!

    #1435615
    Tom
    Lead Developer
    Lead Developer
Viewing 6 posts - 1 through 6 (of 6 total)
  • You must be logged in to reply to this topic.