タグ

関連タグで絞り込む (1)

タグの絞り込みを解除

CSSとstickyに関するryo_n574のブックマーク (3)

  • Position: stuck; — and a way to fix It

    Sticky elements or frozen panes — as you might know them by — have been around forever in software programs — especially in rows/columns based applications such as Microsoft Excel. Sticky elements are also widely used in mobile (native) applications and in web design. Such elements help users keep a sense of perspective when sorting through long lists or keeping track of their order details when s

    Position: stuck; — and a way to fix It
  • Easier scrollytelling with position sticky

    Easier scrollytelling with position sticky Leaning on CSS to simplify the process. We’ve written a lot about scrollytelling here at The Pudding. We’ve covered everything from a library comparison, to responsive best practices, to a deep-dive into Scrollama. But there is always room for improvement. One of the biggest implementation pains with scrollytelling is the sticky graphic pattern, whereby t

    Easier scrollytelling with position sticky
  • position: stickyの面白い使い方と使用時の注意点

    スクロールに応じてページ要素を固定表示できるposition: stickyが便利で面白い使い方ができそうなので実験してみました。仕様がまだ草案(Working Draft)の段階 で、将来、細かい部分に変更がないとは言い切れませんが、Edgeを含めた最新のブラウザで、ほぼサポート されています。 position: stickyの仕様 ブラウザ・サポート状況(Can I use…) フィーチャー・クエリ(@supports) と一緒に使えば、position: stickyに対応していないブラウザにも考慮した実装が可能なので、注意は必要ですがちょっとしたエンハンスメントとして使うのに良さそうです。 まずは「こんなのが簡単にできちゃいますよ」というデモからご紹介します。 面白い使い方 基的な使い方だけでも便利なスティッキーですが、応用するとスクロール効果のような面白い使い方ができます。以

    position: stickyの面白い使い方と使用時の注意点
  • 1