Change logo image while scrolling?

Hi,

There is no such option in Themler, but you can try to use some code for that. You are using Sticky extension for the logo or header, right? Then you can use the CSS code with the .affix class to assign another image in the logo to the header when it is scrolled down.

Sincerely,
Hella

Can you explain this more? I want to do it too.

Thanks

http://answers.themler.io/articles/96208/change-header-height-on-scroll#example-1

This worked like a charm!

Hi,

You are welcome. Nice to hear that it worked for you.

Sincerely,
Hella

Super simple too. Thanks

Love the program a lot!!

Hello, another question related to this. How can I have a phone number that is text in the header and when scrolled it disappears or gets smaller?

Thank you

Hi,

The idea is the same as in the article above. You add the code with the .affix class name and the name of the class of the container with the phone number. Then use display:none; property to disable it when scrolled or font-size to define the new font size.

Sincerely,
Hella

Hello All,

I love this and used it for the first time, amazing....

http://answers.themler.io/articles/96208/change-header-height-on-scroll#example-1

Thanks for this link to showcase to Mr. Dave & Themler Technical Team (Hella) etc...

Is there any way to make it fully automatic instead of adding the script as below

.affix [class*="bd-logo"]
{
height: 100px; 
-webkit-transition: height 300ms linear;
transition: height 300ms linear;
}

.affix-top [class*="bd-logo"]
{
-webkit-transition: height 300ms linear;
transition: height 300ms linear;
}

1) Is the implemented in the new release of Themler tool?

If yes, kindly share the step by step process to achieve the same.

2) And, can we achieve the same animation in Mobile version too?

Regards
Suffian Ahmed

Last edited 01 July 2018 by Web IT Solutions LLP

Is the implemented in the new release of Themler tool?

Themler now on hold due all developers gone to Nicepage project. Please ask to come back developers back to Themler. The main reason of Nicepage development: some Themler users ask for a more simple tool, to generate (not to build) webpages with few clicks. So we need to proof than there still many users who want work with Themler instead of Nicepage.

Hi,

Is the implemented in the new release of Themler tool?

No, unfortunately.
In fact, it is quite difficult to implement it in Themler UI. The task to change something on page scroll may include hundreds of features which may affect almost all Themler controls. And all features that you may imagine should be compatible with Sticky extension. I don't think that it is possible. Therefore, if we implement it in Themler this feature will be quite limited and you will ask us to add more and more features. This will cause a lot of more problems. In this case the manual solution is better because it does just what you need and nothing more.

Thank you,
Olivia

Can we change the image file while scrolling? Like here: https://genesys.lux-hospitality.de/

Hello,

Did you please try the solution described in this article:
https://answers.themler.io/articles/96208/change-header-height-on-scroll

Sincerely,
Nettie