# Липкие аватары: аватары постов следуют за прокруткой

**URL:** https://meta.discourse.org/t/sticky-avatars-posts-avatars-following-scroll/206634
**Category:** Feature
**Created:** [21.Октябрь.2021 08:24:08 UTC](https://meta.discourse.org/t/sticky-avatars-posts-avatars-following-scroll/206634 "2021-10-21T08:24:08Z")
**Posts on this page:** 11
**Page:** 1

<div class="post-metadata">

### Author: ![loic](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/loic/32/105621_2.png) [@loic](https://meta.discourse.org/u/loic)
#### Post date: [21.Октябрь.2021 08:24:08 UTC](https://meta.discourse.org/t/sticky-avatars-posts-avatars-following-scroll/206634/1 "2021-10-21T08:24:08Z")

</div>

⚠ **Это теперь [официальная функция, включённая в Discourse](https://github.com/discourse/discourse/commit/c2be7c65e87abb76f11298248347d94654925ee4), [репозиторий компонента темы архивирован](https://github.com/discourse/sticky-avatars), его следует удалить, иначе это вызовет сбои** ⚠

Если по какой-то причине вы хотите отключить липкие аватары, в настоящее время существует обходной путь с использованием CSS:

```css
.topic-post.sticky-avatar {
  .topic-avatar {
    position: relative !important;
    top: unset !important; /* Может потребоваться в некоторых случаях */
  }
}

```

---

<div class="post-metadata">

### Author: ![Paracelsus](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/paracelsus/32/164912_2.png) [@Paracelsus](https://meta.discourse.org/u/Paracelsus)
#### Post date: [13.Ноябрь.2021 14:19:00 UTC](https://meta.discourse.org/t/sticky-avatars-posts-avatars-following-scroll/206634/12 "2021-11-13T14:19:00Z")

</div>

Привет! Было бы здорово иметь мобильное решение.

На компьютере всё работает отлично, и я понимаю, что из-за нехватки пространства сложно напрямую перенести это на мобильные устройства. Но, возможно, стоит добавить маленькую иконку аватара прямо под главным меню? (Я знаю, это не очень удобно с точки зрения UX).

---

<div class="post-metadata">

### Author: ![codinghorror](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/codinghorror/32/110067_2.png) [@codinghorror](https://meta.discourse.org/u/codinghorror)
#### Post date: [14.Ноябрь.2021 04:50:22 UTC](https://meta.discourse.org/t/sticky-avatars-posts-avatars-following-scroll/206634/13 "2021-11-14T04:50:22Z")

</div>

Наше текущее мнение заключается в том, что такое поведение на рабочем столе не является приемлемым компромиссом для мобильных устройств.

---

<div class="post-metadata">

### Author: ![loic](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/loic/32/105621_2.png) [@loic](https://meta.discourse.org/u/loic)
#### Post date: [16.Ноябрь.2021 09:21:15 UTC](https://meta.discourse.org/t/sticky-avatars-posts-avatars-following-scroll/206634/14 "2021-11-16T09:21:15Z")

</div>

Функция «липкие аватары» теперь официально доступна в Discourse 🎉

Вы можете ознакомиться с коммитом:

> <https://github.com/discourse/discourse/commit/c2be7c65e87abb76f11298248347d94654925ee4>
>
> This patch takes the small component we had for sticky avatars and adds
> it into …our core code base.
> 
> A small refactor has been made to have a \`StickyAvatars\` dedicated class.

Я отредактирую первое сообщение, чтобы отразить это.

---

<div class="post-metadata">

### Author: ![valsha](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/valsha/32/230631_2.png) [@valsha](https://meta.discourse.org/u/valsha)
#### Post date: [16.Ноябрь.2021 15:09:51 UTC](https://meta.discourse.org/t/sticky-avatars-posts-avatars-following-scroll/206634/15 "2021-11-16T15:09:51Z")

</div>

Хорошо, значит, мы можем теперь удалить этот компонент темы? Спасибо.

---

<div class="post-metadata">

### Author: ![bartv](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/bartv/32/130052_2.png) [@bartv](https://meta.discourse.org/u/bartv)
#### Post date: [17.Ноябрь.2021 08:06:37 UTC](https://meta.discourse.org/t/sticky-avatars-posts-avatars-following-scroll/206634/16 "2021-11-17T08:06:37Z")

</div>

Наблюдается несоответствие в поведении: аватары в коротких постах не фиксируются при прокрутке вниз, но фиксируются при прокрутке вверх — см. видео ниже.

Кроме того, я лично предпочёл бы, чтобы фиксация работала и для коротких постов — текущее поведение («только для длинных постов») кажется мне немного запутанным. Возможно, было бы полезно добавить настройку, позволяющую задавать минимальную длину поста для включения этой функции, чтобы каждый мог настроить её под свои предпочтения?

---

<div class="post-metadata">

### Author: ![j.jaffeux](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/j.jaffeux/32/60297_2.png) [@j.jaffeux](https://meta.discourse.org/u/j.jaffeux)
#### Post date: [17.Ноябрь.2021 08:43:51 UTC](https://meta.discourse.org/t/sticky-avatars-posts-avatars-following-scroll/206634/17 "2021-11-17T08:43:51Z")

</div>

> [@bartv](#):
>
> Наблюдается несоответствие в поведении: аватары в коротких постах не закрепляются при прокрутке вниз, но закрепляются при прокрутке вверх — см. видео ниже.

Да, это ожидаемое поведение. После длительного использования мы пришли к выводу, что это лучший компромисс между удобством и визуальным шумом. Суть в следующем: в коротких постах при прокрутке вниз вы сразу видите, кто опубликовал сообщение, а при прокрутке вверх содержимое поста появляется до аватара, что придаёт смысл даже для небольших постов.

> [@bartv](#):
>
> Также я лично предпочёл бы, чтобы закрепление работало и в коротких постах — мне кажется, что текущее правило «только в длинных постах» немного запутывает. Возможно, было бы полезно добавить настройку для контроля минимальной длины поста, при которой включается это поведение, чтобы каждый мог настроить его под свои предпочтения?

Я бы предложил пока немного потерпеть. На данный момент у нас нет планов добавлять настройку сайта для этого.

---

<div class="post-metadata">

### Author: ![j.jaffeux](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/j.jaffeux/32/60297_2.png) [@j.jaffeux](https://meta.discourse.org/u/j.jaffeux)
#### Post date: [17.Ноябрь.2021 08:53:10 UTC](https://meta.discourse.org/t/sticky-avatars-posts-avatars-following-scroll/206634/18 "2021-11-17T08:53:10Z")

</div>

Да, пожалуйста, удалите компонент темы, так как наличие обоих вызовет проблемы.

Я обновил первое сообщение, чтобы это было ясно. Спасибо 👍

---

<div class="post-metadata">

### Author: ![Steven](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/steven/32/187890_2.png) [@Steven](https://meta.discourse.org/u/Steven)
#### Post date: [22.Ноябрь.2021 23:06:50 UTC](https://meta.discourse.org/t/sticky-avatars-posts-avatars-following-scroll/206634/19 "2021-11-22T23:06:50Z")

</div>

> [@loic](#):
>
> ```css
> .topic-post.sticky-avatar {
> .topic-avatar {
> position: relative !important;
> }
> }
> 
> ```

Я потратил немного времени на поиск решения самостоятельно в прошлые выходные, но оно было здесь всё это время 😅

Но в моём форуме мне пришлось добавить `top: unset` из-за проблемы с прокруткой. Поэтому для некоторых пользователей может быть полезно использовать это:

```css
.topic-post.sticky-avatar {
  .topic-avatar {
    position: relative !important;
    top: unset !important;
  }
}

```

---

<div class="post-metadata">

### Author: ![loic](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/loic/32/105621_2.png) [@loic](https://meta.discourse.org/u/loic)
#### Post date: [23.Ноябрь.2021 09:26:02 UTC](https://meta.discourse.org/t/sticky-avatars-posts-avatars-following-scroll/206634/20 "2021-11-23T09:26:02Z")

</div>

Спасибо, я только что отредактировал первый пост 🙂

---

<div class="post-metadata">

### Author: ![loic](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/loic/32/105621_2.png) [@loic](https://meta.discourse.org/u/loic)
#### Post date: [16.Декабрь.2021 07:00:16 UTC](https://meta.discourse.org/t/sticky-avatars-posts-avatars-following-scroll/206634/21 "2021-12-16T07:00:16Z")

</div>

Эта тема была автоматически закрыта через 29 дней. Новые ответы больше не принимаются.
