Full Height Page without Srolling

[sebagc]

Hi Friends!
Is there a way to create a page with one or two sections of content but make it 100% height in Desktop and not allow the user to scroll down? Sort of like the Split Menu form the DesignCloud: http://demo.theme.co/designcloud/headers/split/#

Thank you very much in advance!

Regards,
Sebastian

[jade]

Hi Sebastian,

This would be easier if you will have only one section on the page then you can set the section’s height to 100vh then to make sure that the browser scrollbar will be hidden, add a Body Class to the page then add this code to the Global CSS:

.no-scroll {
    overflow: hidden;
}

The code above assumes that the class you will add to the page is no-scroll.

Then add this code to the Global JS:

(function($){

    if( $('body').hasClass('no-scroll')) {
        $('html').css('overflow', 'hidden');
    }


})(jQuery);

Here are some links as references to the suggestions above:

• CSS vh - https://web-design-weekly.com/2014/11/18/viewport-units-vw-vh-vmin-vmax/
• CSS overflow - https://www.w3schools.com/cssref/pr_pos_overflow.asp
• jQuery hasClass - https://api.jquery.com/hasclass/

Hope this helps you get started.

[sebagc]

Hi Jade!
Thank you very much for all the help! Ill give it a try and also will check the references you sent me.
You guys are the best,
Thanks!

[Prasant]

On behalf of my colleague @Jade you are most welcome.