Как сделать последнюю строку таблицы всегда затемнённой?

Question

[Виталик]

Нужно сделать чтобы при наличии больше 5 строк в таблице последняя строка была затемнённая.
Не могу понять как это сделать чтобы при скроле она оставалась затемнённой.
Через js создаю условие что если в таблице больше пяти строк то 5 затемняется, но при скроле только она и темная а не последняя
что можете посоветовать?

Comments

[edward_freedom]

https://developer.mozilla.org/ru/docs/Web/CSS/:las...

[Виталик]

edward_freedom, Он добавит класс последнему элементу а мне нужно что бы при скроле последний в таблице был затемнён

[Антон Литвиненко]

Накрыть псевдоэлементом

[Виталик]

Всем спасибо)

Answer 1

[Сергей delphinpro]

Просто поверх таблицы внизу наложи блок с фоновым полупрозрачным градиентом.
Чтобы он не мешал указателю – pointer-events: none;

Comments

[Александр Шемаханов]

Виталик Дополнительно еще можно добавить проверку прокрутки списка. Когда список прокручен до конца убирать наложение, чтоб совсем красиво было.

[Сергей delphinpro]

Александр Шемаханов, это обязательно. Дело ведь не только в красоте. Этот градиент является индикатором того факта, что список может быть прокручен вниз.

[Виталик]

Сергей delphinpro,
Спасибо большое, а не подскажете как остледить прокрутку прокрутку в js?

[Сергей delphinpro]

Виталик, где-то здесь https://learn.javascript.ru/size-and-scroll и тут https://learn.javascript.ru/events

[Виталик]

Сергей delphinpro, спасибо