Viewing 2 posts - 1 through 2 (of 2 total)
  • Author
    Posts
  • #199795

    Hi all,

    I’d like to have some pages in which when they load, a colour section automatically takes up the height of the browser window, and scales up or down accordingly if you change your browser window size. Essentially it’s a fullscreen color div, and the content beneath only appears once you start to scroll the window.

    I have experimented with different approaches (such as setting a 100% height for a custom ID applied to the color section DIV, but it doesn’t work.

    Does anyone know if it’s even possible with Enfold?

    Thanks,
    G

    #199834

    Hi Glyphism!

    You need to hire a freelance developer to do this for you or use the Fullscreen Slider element.

    You can also try this:

    Insert a Color Section then add a section ID on “For Developers: Section ID”. Let’s add “fullscreen-section” for example. Edit js > avia.js, find this code:

    $.avia_utilities = $.avia_utilities || {};

    Below, add this code to modify the height of the #fullscreen-section.

    $(function(){
    			$('#fullscreen-section').css({'height':($(window).height())+'px'});
    			$(window).resize(function(){
    				$('#fullscreen-section').css({'height':($(window).height())+'px'});
    			});
    		});

    Cheers!
    Ismael

Viewing 2 posts - 1 through 2 (of 2 total)
  • The topic ‘Color Section with auto browser height’ is closed to new replies.