#topic-progress 요소가 스피너가 표시되는 동안 안티패턴처럼 나타납니다.
모바일 보기에서 주제를 열고 상단의 제목 링크를 클릭하여 스피너를 유도하면 해당 동작을 재현할 수 있습니다.
스피너가 표시되는 동안 #topic-progress를 숨기는 방법에 대해 아이디어가 있으신가요?
1개의 좋아요
여기서 재현이 가능한가요, 아니면 해당 사이트에서만 발생하는 문제인가요?
1개의 좋아요
놀랍게도 메타 사이트는 이 결함에서 면제되어 있지만, 저는 프로덕션 서버와 제가 아는 거의 모든 다른 사이트에서 이를 재현할 수 있었습니다.
또 다른 예시:
수정: 토픽에 게시물이 많으면 스크롤을 하지 않는 한 (토픽 진행 상황) 요소가 표시되지 않는 것 같습니다. 그래서 메타와 같은 일부 사이트에서는 이전에 재현할 수 없었던 것입니다.
다음 배치 로딩 중 모바일 토픽 진행도 위젯에 대해 무언가를 하는 것에 동의합니다. 합리적인 개선안처럼 들리지만, 전체를 숨기는 것이 우리가 원하는 방향인지 확신이 서지 않습니다.
전체 타임라인을 숨기면 콘텐츠가 튀어 보일 수 있어 안티패턴이 될 것입니다.
@design 의견 있으신가요?
물론 서두를 필요는 없지만, 개선해 볼 만한 흥미로운 주제입니다.
2개의 좋아요
답변해 주셔서 감사합니다. 전체 타임라인을 숨길 때 발생하는 바운스 현상에 대한 우려를 이해합니다. 그래서 패딩 공간만 예약하는 방식이 실행 가능할 것입니다.
이 문제는 완전히 CSS 문제라고 할 수는 없으며, 스피너가 활성화된 동안 토픽 진행도를 고정하거나 패딩을 적용하는 것은 JavaScript와 관련이 있습니다.
여기에서 재현되지 않는 이유가 여전히 궁금합니다. try.discourse.org에서 재현할 수 있을까요? 해당 사이트들의 CSS 레이아웃, 예를 들어 추가 헤더 등과 관련된 문제일까요?
1개의 좋아요
아, 다행이네요. 미안해요, 그거 놓쳤어요.
1개의 좋아요
모바일에서 바운스가 발생하지 않을 것 같습니다. 스크롤 시에는 고정 위치(fixed position)를 사용하고, 도킹(dock) 시에는 절대 위치(absolute positioning)를 사용하므로, 어쨌든 레이아웃에 영향을 주지 않기 때문입니다.
도킹 클래스가 붙으면 CSS로 숨기는 간단한 테스트를 해보았습니다(로딩 시 위치가 점프하는 이유가 바로 이 때문입니다. 페이지가 짧고 진행 바가 도킹되기 때문이죠)… 사라졌다가 다시 나타날 때 바운스가 발생하지 않았습니다.
다른 옵션은 로딩 중에 언도킹(undock)하여 고정 위치(fixed position)를 유지하는 것입니다. 하지만 이 방식의 문제는 페이지 맨 아래(예: 추천 주제에 있을 때)에서 맨 위로 점프할 경우, 타임라인이 도킹된 위치에서 고정 위치로 전환될 때 위치 점프가 보일 수 있다는 점입니다.
어쨌든 직접 시도해보고 가장 좋은 방법을 찾아보겠습니다.
4개의 좋아요