Hide Website Header On Scroll -- Headroom.JS Tutorial (Wordpress / Oxygen Builder)

Поделиться
HTML-код
  • Опубликовано: 3 ноя 2024

Комментарии • 14

  • @stevenellis6884
    @stevenellis6884 5 месяцев назад

    This is still very helpful. I was able to follow this tutorial and got it running on my Bricks Builder site in a few minutes! Thank you.

  • @DearFrench
    @DearFrench 3 года назад +1

    VERY useful James. Thanks a lot!

  • @vcodev108
    @vcodev108 3 года назад

    Thank you very much for showing this to us!!!!

  • @mirzaboric1436
    @mirzaboric1436 2 года назад +2

    Hey James, I tried this but it looks like it messed with the mobile pro menu. Rather than having a slide-out drawer, it would contain it in the actual header. Any idea why the conflict would be happening?

  • @deafdogdesign
    @deafdogdesign 3 года назад

    Thank you James! FYI I couldn't get it to work by setting the cdn link in advanced scripts and then adding the init directly. Pasting the code and then adding the init like you show in the video works. I hope to figure out what I am doing wrong with the url method.

    • @Joe-ss9cr
      @Joe-ss9cr 3 года назад

      Same here. Did every step correct. Did you get it fixed eventually?

  • @lesterfranco
    @lesterfranco 3 года назад +1

    Thank you for the tutorial it's is very helpful!
    By any chance, do you have any solution to the mobile issue?
    The off-page mobile menu is not clipped by the size of the header.
    Thanks!

  • @12323mari
    @12323mari 3 года назад

    Awesome video! I implemented this on my site and really like it. I have a follow-up question regarding accordions.
    When I open and then close the accordion, in some situations it causes the header to trigger and become visible.
    I am looking at the following from the headroom team:
    freeze method: When called, this method will freeze the current headroom's state (pinned or unpinned). Headroom will not react to the user's scroll. If you wish to re-enable the headroom's default behavior, you can call unfreeze method.
    unfreeze method: When called, this method will resume headroom's default behavior. Headroom will pin or unpin when the user scrolls the page. By default, Headroom is not frozen, and calling this method before freeze will do nothing.
    I think this maybe would solve the issue if the user is triggering the accordion?
    Any thoughts would be greatly appreciated.

  • @jamieprescott100
    @jamieprescott100 2 года назад

    Tip: Use position sticky instead of position fixed if you don't want the header to overlap your content.

  • @nicothefreelancer
    @nicothefreelancer 3 года назад

    appsumo no longer using same effect. why do you think?

    • @nicothefreelancer
      @nicothefreelancer 3 года назад

      Because I was looking how to make it smooth show. like there's a little show transition. The same with appsumo

    • @nicothefreelancer
      @nicothefreelancer 3 года назад

      Mine just snaps in. no transition. my site is oxypinoy(dot)com

  • @cokidevssiregar2474
    @cokidevssiregar2474 3 года назад

    the blog post link tutorial is broken, 404

    • @IsotropicDesign
      @IsotropicDesign  3 года назад

      Apologies !! isotropic.co/sliding-sticky-header-for-your-website-headroom-js-tutorial/