Html에서 화면 영역 이동 방법

안녕하세요.

Html에서 a 태그를 클릭하면 해당(href) 영역으로 이동하고자 합니다.

<a href="#1-header">Header</a>

<h2 id="header">1. Header</h2>

문제는 이 Html 형식이 GitHub 마크다운(Flavored markdown) 을 기반으로 변환했기 때문에 a 태그의 href 값이 일반 a 태그에서 사용하는 것과 다른 형식인 것 같습니다.

어떤 방식으로 해결할 수 있을까요?

깃허브 마크다운에서 링크 연결 부분 참고

## Overview
- [WPF Core DLLs](#1-wpf-core-dlls)
- [Code Styles](#2-code-styles)
- [Try Catch](#3-try-catch)
- [Code Quality Check](#4-code-quality-check)
- [Resources](#5-resources)

...

### 1. WPF Core DLLs
...
### 2. Code Styles
...
### 3. Try Catch
...
### 4. Code Quality Check
...

(혹시 제가 마크다운을 잘못 사용하고 있는 것이 아닐지…?)

읽어주셔서 감사합니다. :smile:

마크다운 파일을 처리하는 해석기마다 처리 방법이 제각기라서, 혹시 정확히 어떤 곳에서 사용하려고 할 때 문제가 발생하는지 설명을 덧붙여주셔야 좋을 것 같습니다. GFM (Github Flavoured Markdown)은 처리 형태에 관한 것이라 Github이 아닌 곳에서도 GFM은 지원하기 때문에 추가로 질문드립니다.

1개의 좋아요

@rkttu 자세한 설명 감사드립니다! :smile:

첨부한 이미지는 WPF 환경입니다.

그리고 우측 Markdown 영역은 Cefsharp.WPF 라이브러리를 사용한 WebBrowser 부분입니다.

웹은 실제 CSS Markdown에 관련된 CSS와 마크다운(Html으로 변환된)을 전달받는 Javascript 정도만 있는 빈 웹사이트입니다.

설명을 잘 못드려서 죄송하네요 ㅠㅠ

화면에서 a 태그 링크(Try Catch)를 클릭했을 때 하단에 있는 영역으로 스크롤을 이동하고 싶습니다!

위의 HTML이 맞다면 아마도 Javascript의 도움을 받지 않을까 예상합니다. 정상적으로 이동하는 페이지에서 소스코드 보기로 어떤 Javascript를 사용하는지를 확인하면 될것 같아요

1개의 좋아요

@rkttu @dimohy

제가 잘 이해를 못한 상태에서 질문드린 것 같네요.
계속 도움 주셔서 감사합니다.

Markdig 라이브러리에서 Html 변환에 문제가 있어 해당 GitHub 이슈에 문의 중입니다.

Github Markdig Issue Here.

문제를 해결하면 다시한번 업데이트 하겠습니다.!

1개의 좋아요

아… 이해했습니다. 1. , 2. 가 해석될 때 id에서 빠지는군요. 그것이 원인이라면 일단 #1- 등을 빼면 될 것입니다. 이건 의도한것 같아요

1개의 좋아요

@dimohy 아하… 감사합니다. 다른 오픈소스 README.md 읽어 보니 1. 2. 숫자 달려있는 제목은 거의 없는 것 같네요.

숫자를 빼겠습니다.

도움 주셔서 감사합니다. :smile: