This topic contains 9 replies, has 2 voices, and was last updated by  Hans (Support Admin) 1 year, 2 months ago.

Responsiveness, Parallax

  • Hello! I am currently working on pulling in elements for my website and it seems as though the responsiveness of the site, along with the parallax effects are no longer working on smaller screen sizes (everything works when viewed on my computer at full screen size, but not when I decrease the screen size and also does not work properly in Safari on my Iphone etc.). In addition, when the screen size is decreased, the top menu bar is not sticking to the top as I want it to. Not sure what went wrong or how I can fix it?

    Hello @evolution447

    The parallax effect is disabled on mobile screen sizes because it doesn’t play well with those devices.

    As for the sticky menu, did you select that as an option in the Header settings found in the Integral Options Panel?

    Hi Hans,

    That’s unfortunate about the parallax, I love how it looks on the computer and am disappointed to hear it won’t work on mobile. But understandable.

    Yes, I have the sticky menu selected to on in the header settings. It works on my computer but as soon as you decrease the screen size or view on mobile, the menu no longer sticks when you scroll down.

    Hello @evolution447

    My apologies for the late reply. I thought I had responded already but it seems like I did not.

    I double-checked the code for the theme and the behavior of the menu on mobile was changed to static because the sticky menu would take up too much of the mobile screens height especially when users had uploaded larger logos.

    However, you can change this by editing line 1896 of the style.css file.

    Removed the following code;

    .navbar-fixed-top {
        position: relative;
    }
    This reply has been marked as private.

    Can you link to your website so I can have a look?

    This reply has been marked as private.

    Ok, try this code and add it to the Custom CSS field of the Custom Code section in Integral Options Panel.

    @media (max-width: 767px) {
    	.navbar-fixed-top {
    		position: fixed;
    	}
    }

    The background images are made to always take up 100% of the height of the section otherwise you would have blank white space. The fact there are long testimonials affects the height of that section, which affects the background image.

    Nice site by the way, you’ve done well with the theme.

    This reply has been marked as private.

    You’re welcome 🙂

You must be logged in to reply to this topic.