2025年11月5日(水)
CSSの新しいクエリscroll-stateを使用すると、ページの途中で上にスクロールした際にヘッダだけを再度表示が簡単に実装できるようになります
CSSに便利な機能が追加されます！
スクロールした方向を記憶するクエリで、たとえば下にスクロールしたときにはヘッダも普通に上部に隠れ、その後ページのどこからでも上にスクロールするとヘッダを上からアニメーションで再度表示するといったことがほんの数行のCSSで簡単に実装できるようになります。
Solved by CSS Scroll State Queries
by Bramus!スクロールの状態をクエリするCSSのscroll-stateに新しいタイプscrolledが使えるようになります。
スクロールが可能であることを表すscrollableとは異なり、scroll...
0
10
66
0author:
コリス
2006年の開設以来、一貫してサイト制作に関する最新情報を提供しているクリエイティブブログ
‹ PREV
株式会社マーケティングアプリケーションズ、「MApps Panel」をWOW WORLDの「WEBCAS formulator」と連携
NEXT ›
会議内容をAIで文字起こし、内容に関する質問への返答等が可能でプライバシーも守られるオープンソースのCluely代替・「MeetMinder」
Ads
2006年の開設以来、一貫してサイト制作に関する最新情報を提供しているクリエイティブブログコリスの記事『CSSの新しいクエリscroll-stateを使用すると、ページの途中で上にスクロールした際にヘッダだけを再度表示が簡単に実装できるようになります』についてまとめています。
この記事は特にアニメーション・SEO・Chrome・Macについて書かれており、 気になるWebデザインの記事やまとめを見つけたら「本文を読む」をクリックすると、記事配信元のコリスで全文を閲覧することができます。RSS Sourceの「このサイトの記事一覧」をクリックするとコリスの記事をまとめて表示することができます。また閲覧数や各SNSのシェア状況を目安に、他の人たちが記事をどのように評価しているのか推測することができます。Webデザインにとって有益な記事をまとめていますので、ぜひリンク先をチェックしてみてください。
Ads
