Articles on Smashing Magazine | For Web Designers And Developers 日本語 フォロー 「JavaScriptとCSSを使った「移動ハイライト」ナビゲーションバーの作成」 このチュートリアルでは、Blake Lundquistが、プレーンなJavaScriptとCSSのみを使用して、「移動するハイライト」ナビゲーションパターンを作成する2つの方法を説明します。最初のテクニックでは、getBoundingClientRectメソッドを使用して、ナビゲーションバーのアイテムがクリックされたときに、明示的にボーダーをアニメーション化します。2番目のアプローチでは、新しいView Transition APIを使用して、同じ機能を実現します。 Creating The “Moving Highlight” Navigation Bar With JavaScript And CSS smashingmagazine.com Articles on Smashing Magazine | For Web Designers And Developers 日本語 RSS thenote.app
getBoundingClientRectメソッドを使用して、ナビゲーションバーのアイテムがクリックされたときに、明示的にボーダーをアニメーション化します。2番目のアプローチでは、新しいView Transition APIを使用して、同じ機能を実現します。