Support » Plugin: Sticky Header Effects for Elementor » Height not changing on scroll

  • Resolved npierno

    (@npierno)


    I was honestly going to bail on Elementor until I saw your plugin. Thanks for this awesome contribution!

    Unfortunately, it seems to be completely ignoring the “shrink” setting. The colour will change on scroll, but the size won’t change no matter what I do.

    Happy to give you login info, if you’d like to go in a play around.

    Here’s a screenshot of my current settings: https://monosnap.com/file/t5e3kywmQFxZnSvgDLANGBH4gzR47t

    Here’s the implementation in action: http://brosfab.wpengine.com/

    I’m using Astra + Elementor Pro.

    Thanks!

    The page I need help with: [log in to see the link]

Viewing 14 replies - 1 through 14 (of 14 total)
  • Plugin Author Robert Wattner

    (@rwattner)

    The “shrink” effect is restricted by the height of the section’s sontent. This includes logos, or other images, and padding for the sections, columns, and elements in the header.

    To get the best “shrink” effect use these settings:
    * Set the top and bottom padding to 0px on your sticky header section, column, and elements inside of it.
    * Set a custom logo and other image height(you can leave the width blank for “auto”).
    * Set the header section height to “min height” and adjust it to your desired height.

    Basically what happens is that the content of the header is “too tall” to shrink down anymore.

    Plugin Author Robert Wattner

    (@rwattner)

    This has been added to the F.A.Q. section. Thanks!

    I’ve tried everything suggested and it’s not working for me. The logo doesn’t shrink.

    Do you have an email where I can send you my login info?

    Moderator stephencottontail

    (@stephencottontail)

    @ljgarnes: Please do not offer to give your login credentials. Plugin (and theme) authors can get in trouble if they take you up on your offer, and it’s really not an offer you should be giving, either.

    Plugin Author Robert Wattner

    (@rwattner)

    @ljgarnes Shrinking logo is not currently an option. We are working on that right now though and it should be available in the next update.

    This is very confusing. First, you give instructions on how to best implement the Shrink option. Then, you post that it is not currently an option, which it is.

    Plugin Author Robert Wattner

    (@rwattner)

    @sebrame The shrink option currently on works on the section padding. It can’t change height of images or other objects within the header. We are working on this feature for the next update.
    You can use the CSS selector .she-header to change your logo height for now.
    Select your logo and go to the advanced tab and add “logo” to the class field(without a . )
    Now add this custom CSS

    .she-header .logo img {
    max-width: 100px ! important;
    }

    Change “100px” to the size you want the logo image to be after scrolling.
    Width is used because it will scale the height automatically.

    Hope this helps.

    Sebrame: “This is very confusing. First, you give instructions on how to best implement the Shrink option. Then, you post that it is not currently an option, which it is.”

    You’re confusing shrinking-of-the-header-container, which this feature currently does, with shrinking-of-particular-content-inside-the-header, like a logo. The former is what this discussion thread is talking about… getting the existing shrink option to work correctly.

    IMHO, not everyone would want a shrinking logo to automatically happen inside a shrinking header. I would want it as a separate option and it seems like it’s an upcoming feature in the free version (check the plugin homepage).

    In the meantime, a shrinking logo is possible with custom CSS; the traditional way.

    Hi,
    the plugin don’t run with last version of wordpress.
    None of the plugin options seem to work. Transparency, resize, etc.
    I seem to have followed all the instructions, how can I solve it?
    thanks

    VT

    acornavi

    (@acornavi)

    Hi,
    I tried corrections you proposed to make header shrink but still, it doesn’t work. I don’t use the logo image, only textual logo, and menu as usual. Any ideas?

    Otherwise, thanks for the plugin. It has a good future.

    Thanks

    Plugin Author Robert Wattner

    (@rwattner)

    @acornavi Hi, sorry you are having problems. Do you have a link to the page you are working on so I can take a look? Thanks

    bisquider

    (@bisquider)

    What Robert wrote:

    To get the best “shrink” effect use these settings:
    * Set the top and bottom padding to 0px on your sticky header section, column, and elements inside of it.
    * Set a custom logo and other image height(you can leave the width blank for “auto”).
    * Set the header section height to “min height” and adjust it to your desired height.

    + Edit Nav Menu -> Style -> Vertical Padding leave blank

    Worked for me.

    • This reply was modified 7 months ago by bisquider.
    Plugin Author Robert Wattner

    (@rwattner)

    @bisquider thanks for your input

    @bisquider – I followed your instructions to a T but this didn’t work.

    Here’s the website I’m working on: http://bit.ly/2RyOrQK.

    Does the header get a unique class when it’s sticky? I found that if I add this CSS, it works, but I cannot figure out how to target it only when the header is sticky.

    .elementor-26 .elementor-element.elementor-element-694c3d36 > .elementor-container {
    	min-height: 110px !important;
        height: 110px !important;
    }

    Thanks,
    Todd

Viewing 14 replies - 1 through 14 (of 14 total)
  • The topic ‘Height not changing on scroll’ is closed to new replies.