Diagonal effect pro header

[Borislav_VD]

could be achieved something lke that using pro header?

[basanta]

Hi There,

This can be done in pro header builder using similar image used in the website.
In the website the logo itself a diagonal at right end with a transparent BG.

Please check the screenshot.

Thanks

[Borislav_VD]

Ok great it is true! and what about the effect from big to small of the logo . When you click into the website there are 3 bars and the logo is big , after scrolling the upper bar dissapears and the logo is smaller . How can i achieve this logo effect i mean bigger logo when i have 3 bars for example and smaller logo if i have 2 bars .

[christian]

Hey @Borislav.VD,

That is not possible out of the box but still achievable using a few custom CSS. See https://youtu.be/rJBUKAgQ-TM

.x-bar-fixed .e14-6.x-image {
    transform: scale(.5);
    margin-top: 0;
    transition: all 0.2s;
}

Hope that helps.

[Borislav_VD]

GREAT !!! THANK you @christian_y

How can i find what i must use i mean instead of ¨.x-bar-fixed .e14-6.x-image ¨ ?
In which area i must put this css code? thankks you are great !

[christian]

Just change e14-6 with your own class like scale-up

Also forgot that your image must be set to Standard and play around with the Width and Top Margin values.

Add it in the Header CSS

Just a little disclaimer here. Since we’re using custom CSS, we could not support issues that will arise from the use of it and provide further enhancements. It’s just a head start.

Thanks.