Enabling carousel design patterns in CSS

[flackr]

Session description

Carousels are an often used design pattern on the web. They are used in a variety of contexts, from product listing pages to slideshow like content. OpenUI has explored a range of carousel designs, showing that the specific layout and appearance can vary dramatically. They are also provided by many frameworks as components, however implementing a carousel correctly is complicated and often results in inconsistent and sometimes inaccessible implementations on the web today.

There are a set of problems being solved by carousels, which we believe could be provided by a set of simple incremental CSS features, allowing developers to combine these CSS features to create the various designs in a completely customizable fashion. CSS-only component libraries could be built to further simplify this process with an eventual built-in style similar to customizable select.

Prior discussions:

• Carousel APIs generally: [css-pseudo-4] Enabling carousel design patterns in CSS csswg-drafts#9745

Session goal

Share planned feature set and demos. Discuss gaps and plan how the related features should work.

Additional session chairs (Optional)

No response

Who can attend

Anyone may attend (Default)

IRC channel (Optional)

#css

Other sessions where we should avoid scheduling conflicts (Optional)

#28, #47, #43

Instructions for meeting planners (Optional)

No response

Agenda for the meeting.

1. Introduction / update [css-pseudo-4] Enabling carousel design patterns in CSS csswg-drafts#9745
2. Scroll markers [css-overflow-5] Scroll-markers csswg-drafts#10720
3. Inert [css-ui] Support setting offscreen content inert csswg-drafts#10711
4. Limited fragmentainer styling (e.g. columns) [css-overflow-5][css-scroll-snap-2] Snapping and generating scroll-marker pseudo-elements from fragments csswg-drafts#10715
5. Scroll buttons [css-overflow-5] Scroll button pseudo-elements csswg-drafts#10722
6. TBD

Links to calendar

• 2024-09-25, 14:45 - 15:45

[tpac-breakout-bot]

Thank you for proposing a session!

You may update the session description as needed and at any time before the meeting, but please keep in mind that tooling relies on issue formatting: follow the instructions and leave all headings and other formatting intact in particular. Bots and W3C meeting organizers may also update the description, to fix formatting issues or add links and other relevant information. Please do not revert these changes. Feel free to use comments to raise questions.

Do not expect formal approval; W3C meeting organizers endeavor to schedule all proposed sessions that are in scope for a breakout. Actual scheduling should take place shortly before the meeting.