window.pageYOffsetを使って、スクロール位置によってヘッダのクラスを変更します。

CodePen.スクロールに合わせてヘッダーを変更

See the Pen 【04-03-02】スクロールに合わせてヘッダーを変更 by jun (@zionboogie) on CodePen.