Show GN: 듀얼 페이지 싱크 - 외국어 개발문서를 보기 쉽게 해주는 크롬 확장프로그램
(chromewebstore.google.com)크롬 확장프로그램 하나 만들었는데 써보세유
개발문서 볼 때, 원문과 한글을 동시에 스크롤 하면서 보면 좋겠다는 니즈로 만들었어요
- 확장프로그램 실행 시 현재 창과 동일한 사이트가 뜨면서 화면 양쪽으로 분할
- 한쪽을 구글 번역 등으로 번역 후 스크롤하면서 사용
- url 연동 기능으로 한 브라우저에서 다른 사이트로 이동하면 같이 이동
- 개발문서 자체가 한글 번역 본을 제공할 경우, url 동기화 제거 후 사용
- 싱크가 안맞을 경우 스크롤 동기화를 off 한 후 수동으로 스크롤
두 브라우저의 높이 비율을 계산하여 스크롤을 연동하고 있어 조금의 차이는 있을 수 있어요!
댓글과 토론
좋은 기능이네요.
스크롤 동기화 아이디어:
스크롤 발생시 스크롤 위치를 이용하기 전에 elementFromPoint 로 마우스 위치 객체를 얻어서 xpath 만들어 해당 객체를 찾아 객체의 높이로 맞춰주면 어떨까요?
해당 객체가 화면 밖에 걸쳐있으면 스크롤 위치로 대체하는 등 예외사항이 좀 필요하겠네요.
뉴스 사이트 같은곳에서는 잘 되네요.
https://github.com/features/copilot
이런 인터렉티브한 사이트에서 확인 해서 잘 안되었나봐요.
좀 더 사용해 보겠습니다. 감사합니다.
사용해주셔서 감사합니다!
코파일럿 메인 사이트 같은 경우는 저는 잘되는데 혹시 안되시나요?
말씀하신 것처럼 피그마처럼 url 이 수시로 변하는 사이트의 경우에는 무한로딩이 일어날 수 있고,
스토어의 서비스 설명 글에 적어놓긴 했는데, 구글이 제공하는 서비스 들(gmail, drive)에서도 작동하지 않는거 같아요. 스크롤 이벤트가 감지되지 않는다든가 등의 이유 같은데, 아직 파악은 안되서 적용하지 못했습니다!