Making Page Header sticky

Home Forums Porto – Responsive HTML5 Template Making Page Header sticky

Tagged: 

Viewing 5 posts - 1 through 5 (of 5 total)
  • Author
    Posts
  • #10008802
    ljsimon
    Participant

    Hi all,

    I’m trying to make page header sticky in a page based on “page-sticky-sidebar.html”, unfortunately without luck.

    How can I do that?

    Thanks for your support!

    Kind regards,
    lj


    #10008806
    Support
    Keymaster

    Hello, can you please send me the URL so I can check what exactly you did so far?

    Also, just to make sure, you want to keep the header and the page header (black bar) sticky as well, right?

    Kind Regards,

    Jonas


    #10008812
    ljsimon
    Participant
    This reply has been marked as private.
    #10008818
    Support
    Keymaster

    Hello, please try this:

    <section class="page-header" data-plugin-sticky data-plugin-options='{"minWidth": 991, "containerSelector": ".main", "padding": {"top": 73}}'>

    (css/custom.css)

    .page-header {
    	z-index: 1;
    }

    Kind Regards,

    Jonas


    #10008831
    ljsimon
    Participant

    Hi again Jonas,

    It worked! 🙂

    The side effect is that the sticky menu goes now behind the page header, so it’s hidden at the top. I’ve solved it adjusting data-plugin-options on the sidebar.

    Greetings,
    lj


Viewing 5 posts - 1 through 5 (of 5 total)

This topic is marked as "RESOLVED" and can not rceive new replies.