$50 fixed price. Wordpress custom header for ThunderCats HHOOOOoo!

This is a two part job based around a custom header development within my wordpress theme (x-theme by [login to view URL]). I'd like to replicate the header / nav bar code that you find on some modern styled themes like these two: [login to view URL] [login to view URL] Specifically, when the reader scrolls down past the header, the logo image snaps into the sticky nav bar on the left-most side (it is reduced in size) Other menu items are moved right to make space for the logo. When the user scrolls back up the effect is reversed and the small logo disappears, the menu items return to the left and the larger logo is revealed again when the header becomes visible. I can give access to the code for the demo sites above so you can see how they've been set up on those two sites. I also have some basic working logic that you can see at work on this link here: [login to view URL] The project is for a really cool non-profit community site that celebrates the ThunderCats, that awesome 80s cartoon and toy line. We earn very minimal ad revenue that barely covers our hosting fees and so regretfully the job pays very little. But you will have a lot of gratitude from our community and I'll happily support the successful developer in their future freelance pursuits, by writing a recommendation and being available to any future potential clients who may ask for reference checks. I'd also be willing to provide credit for your work with a thank you and back link to your own site if you have one, on our community page. Thanks! Design Type: Redesign Purpose of the WordPress Website: Community Website Number of Pages to be Designed: 2 Description of Each Page: 1) Wordpress sitewide header needs custom development to replicate conditional formatting and inclusions to the nav bar based on when the user scrolls down a certain distance (to the bottom edge of the header). Need this done within the x-theme by [login to view URL] 2) Want to then fix the same banner to the top of the forums / bulletin board software (xenforo) so that visitors who come in through either the website section or the forums section have the same navigation experience. It's important that this NOT be done with iframe, and I prefer a proposal that will ensure when I make changes in the future to the nav menu in wordpress, that it carries through to the xenforo pages too. Websites with a Similar Style or Look: [login to view URL] Watch how the 'Explicit' logo snaps into the sticky nav bar when you scroll down past the header, and how the logo is made smaller, and other nav bar menu items are shifted right to make room. Then when scrolling back up the change is reversed. Additional Comments: It's important that the changes are made within the child theme. As I'd like to understand how to tweak or make changes to the functionality down the road, I'd like a tutorial hand off so that I can ask questions about how the code was implemented, what files were modified etc. It's likely that the second part of the job will be more difficult to implement, if you fail at this part but succeed with the first, I'll pay for successful completion of the first part.