Kadzi
@Kadzi
Ом

Как лучше реализовать карточки?

Привет, интересуюсь не как верстальщик,

нужно реализовать 1 блок с карточками. Есть 5-8 товаров, которые нужно сделать в виде слайдера:
5aeb2afc60fea034515677.png.

Со смартфоном и планшетом все понятно. Но что, если их станет например 10, 18 или 30? Как в таком случае они должны выглядеть на ПК?

Есть ли решения, кроме потока, как я в Яндекс картинках?

5aeb2c68836f5993144125.png

Во что мог бы преобразоваться такой длинный слайдер на ПК? Это условно было бы что-то типа такого? Пример:

5aeb2e9517111239085154.png

Имело бы смысл, для этого блока, с учетом что карточек стало больше 5-9, делать так? Пример, с сайта культурволк, слайдер привязан к левому краю:

5aeb301c37bcc383217872.png

Буду рад впитать любую полезную инфо по карточкам, слайдеру и типичным проблемам.
  • Вопрос задан
  • 322 просмотра
Решения вопроса 1
xmoonlight
@xmoonlight
https://sitecoder.blogspot.com
Я бы оставил в одну линейку (оставил бы также слайдером) и, возможно, сделал бы их горизонтальными, если ширина окна браузера превысит 1200px.
Т.е., светлую часть с жёлтой кнопкой - разместил бы справа.
Это избавило бы от "частокола" и от "размытия" внимания от единовременного отображения большого количества карточек.
Заодно, это сразу бы уменьшило высоту слайдера в 2 раза, что позволило бы больше увидеть того, что ниже на странице без скролла.
Ответ написан
Пригласить эксперта
Ответы на вопрос 3
mixail_fet
@mixail_fet
Дизайнер веб-интерфейсов
Некорректно сразу загружать 30 карточек, которые будут в слайдере, да и слишком большой объем для скролла, никто не будет прокручивать до 30-ой карточки в слайдере, где только 5 товаров видно изначально.

Вариантов несколько:

1. Кнопка "показать еще" - при нажатие, плавной анимацией будет появляться еще 6 карточек. Тогда на ПК вообще не нужно будет реализовывать слайдер.

2. Кнопка "показать все", которая ведет на полный список всех карточек.
Ответ написан
Комментировать
tema_sun
@tema_sun
Ненавижу горизонтальный скролл на десктопе. Мне совершенно не сложно покрутить колесиком вниз, но в бок - нафиг надо.
Я за вариант без слайдера на десктопе.
Ответ написан
Комментировать
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы