Feature request: hide logo on scroll

[skafte]

Hi Andrii,

Just another feature request / hope for your help :-)

I’m now more or less finished with setting up and modifying my Shogun theme based site (it’s been a pleasure to work with!). The only thing I am still not 100% happy with is how the sticky header transforms and becomes smaller when you scroll down the page; I’ve used the below code to ‘hide’ the logo on scroll in order to give more space to show the content of the site. It kind of works alright, but the header seems to ‘jump’ a bit on scroll and it’s unreliable to show the logo again when it’s been hidden. I therefore hope that either you have a good idea for a way to make it work more smoothly, or, that it will be possible in a future update of the theme, to tick a box in the back-end it will completely hide the logo instead of just making it smaller?

.fixed-header #logo {margin-top: -40px !important;}

Also, in Safari, the logo loads twice on retina displays, which causes Safari to kind of animate the logo to jump out at you (similarly to the Twitter logo in the app when it loads). Not a big problem, but it would be nice to have it appearing in a slightly more subtle way, if it has to be loaded twice. I can live with this, but just thought I would point it out anyway.

All the best,

Jonas

[skafte]

PS. Here’s the site that I am building with the logo/scroll issue: – I am aware that you already know it, but I just thought I would make it clear for others that might be interested in achieving the same.

Thanks,

Jonas

[skafte]

Oops! Here you go: http://onlygraphicdesignerscare.com/ ;-)

[satori]

Hey Jonas,

I’ve made a more generic update, with the action performed via the jQuery piece that controls the fixed header animations, yet wouldn’t say it’s much smoother than your solution; the only difference is that this one can go with a logo of any size.

Regarding the issue with the logo in Safari on retina devices: I will need to test it separately, since I don’t have an Apple device at hand right now. Thank you for bringing this up!

Sincerely,
Andrii / Satori Studio

[skafte]

Cool – thanks Andrii! Works like a charm! :-)

If it’s something you’re considering as a future feature, then I reckon it would be great if the logo simply ‘moved up’ when you scroll down instead of ‘popping’ in and out (the animation effect like the Twitter logo I mentioned earlier). Anyway, for now, and for this site, what you’ve done is more than great, so thanks! (I also reckon it definitely works better than what I had done before).

Cheers!

Jonas

[satori]

Thanks for the suggestion, Jonas! I will see if this can be implemented as well.

Sincerely,
Andrii / Satori Studio

[Author]

Posts