Skip to content

Scrollbar On Demand

About 593 wordsAbout 2 min

2023-08-08

Scrollbar On Demand

Use scrollbars on demand. Currently, we can control whether to display scrollbars, or only display scrollbars when the content is long. But it is strongly recommended to use auto as the overflow property value when the content is uncertain.

overflow-y: scroll

The two birds are singing in the river island.
A beautiful lady is the ideal match for a gentleman.

The water chestnuts are uneven, flowing around.
A beautiful lady, I long for her day and night.

The two birds are singing on the island in the river.
A beautiful lady, a gentleman is looking for her.

The water chestnuts are uneven, flowing around.
A beautiful lady, I long for her day and night.

If I cannot get her, I will think of her day and night.
I am so leisurely, turning and turning.

The water chestnuts are uneven, picking them from left and right.
A beautiful lady, playing the zither and the harp with her.

The water chestnuts are uneven, sifting them from left and right.
A beautiful lady, bells and drums play for her.

As you can see, even if the content is short, you can see the scrollbar, which is not good for the UI. It is unpleasant to see the scrollbar when you don't need it.

With overflow-y: auto, the scrollbar is only visible when the content is long. This is a better visual interaction experience.

overflow-y: auto

The two birds are singing, on the island in the river.
A beautiful lady, a gentleman is a good match.

The water chestnuts are uneven, flowing left and right.
A beautiful lady, I long for her day and night.

The two birds are singing on the island in the river.
A beautiful lady, a gentleman's ideal match.

The water chestnuts are swaying on both sides.
A beautiful lady, I long for her day and night.

If I cannot get her, I will think of her day and night.
I am so leisurely, I turn and turn.

The water chestnuts are swaying on both sides.
A beautiful lady, I am accompanied by the zither and the harp.

The water chestnuts are swaying on both sides.
A beautiful lady, I am accompanied by the zither and the harp.