Tagged: ,

Viewing 10 posts - 31 through 40 (of 40 total)
1 2
  • Author
    Posts
  • November 28, 2017 at 3:31 am #882469
    Ismael

    Hi,

    Is there a CSS code to make the logo stay the same size, but still move like the shrinking logo does. In other words make the shrinking logo bigger?

    @acamediamarketing: Have you tried disabling the Enfold > Header > Header Behavior > “Shrinking Header” option?

    Best regards,
    Ismael

    November 28, 2017 at 3:37 am #882470
    acamediamarketing

    Yes, i have tried that. It does not fit the webpage design, as the header is too bulky. I saw a code that controlled the size of the shrinking logo but i just did not work for me. I like that the header shrinks, it is just the logo that gets too small.

    November 28, 2017 at 6:22 am #882523
    Ismael

    Hi,

    Alright. Please look for the following css modification.

    .header-scrolled .logo img, .header-scrolled.header-scrolled-full .logo img {
    max-height: 58px !important;
}

    Replace it with the following css code.

    .header-scrolled .logo img, .header-scrolled.header-scrolled-full .logo img {
    max-height: 118px !important;
    top: -30px;
}

    Best regards,
    Ismael

    November 29, 2017 at 12:39 am #882941
    hgarcia55

    Hi,

    I have added CSS to make my header logo overlap the container; however, I still want the logo to shrink with the rest of the header when scrolled. Just like this website: http://www.mcorautomotive.com/index.html

    Can you please help me with a fix for that? Here is my page: http://a87.8d7.myftpupload.com/

    -Hannah

    • This reply was modified 6 years, 11 months ago by hgarcia55. Reason: Wanted to include website example of the look I'm wanting
    November 29, 2017 at 7:49 pm #883142
    Guenni007

    this thread is nearly what you like to obtain: https://kriesi.at/support/topic/please-help-for-a-cool-header-design/
    on that solution i changed a bit the code of shrink_fix.js file – you all can read in pastebin . – But thread is old so my test page has gone.

    But on his page you can see the result: https://www.artig.st/ (hope it is ok to post this here – because on his screens you can see the url too)

    You see logo is overlapping and is shrinking on scroll down

    November 29, 2017 at 7:58 pm #883149
    Guenni007

    by the way – if the logo stays transparent on text under the logo – it looks not so nice – maybe a semitransparent background on the subtext looks better – the background is a 50% white under the subtext of your logo: https://webers-testseite.de/sammons/ if you like you can drag&drop the file to use it.

    • This reply was modified 6 years, 11 months ago by Guenni007.
    November 29, 2017 at 8:02 pm #883152
    Guenni007

    if you are satisfied with a 50% shrink – do not set up the max-height of your logo with absolute height but with relative:

    .logo img {
    max-height: 200% !important;
}
    November 29, 2017 at 8:08 pm #883157
    hgarcia55

    Guenni,

    This worked perfectly! Thank you so much!

    October 12, 2021 at 4:24 pm #1324620
    Louiswhite

    Hi,

    When my header shrinks down I can see a random part of the logo on the left hand side?

    Please could someone explain how I can adjust the shrunk header size to get rid of it?

    Website attached.

    Thanks

    October 13, 2021 at 2:19 am #1324662
    Ismael

    Hi,


    @Louiswhite    : To adjust the size of the logo on scroll, try this css code.

    .header-scrolled .logo img {
    width: 100px;
}

    Please open a new thread and post the login details in the private field so that we can check the issue properly. We will close this thread for now. Thank you.

    Best regards,
    Ismael

  • Author
    Posts
Viewing 10 posts - 31 through 40 (of 40 total)
1 2
  • The topic ‘Shrinking Header Logo Size’ is closed to new replies.