Please Enable JavaScript!
Mohon Aktifkan Javascript![ Enable JavaScript ]

마크다운 텍스트와 사이드에 헤딩출력(옵션?)시에.. > 질문답변

본문 바로가기
사이트 내 전체검색

질문답변

마크다운 텍스트와 사이드에 헤딩출력(옵션?)시에..

페이지 정보

본문

아래는 https://www.markdownguide.org/basic-syntax/  에서 캡쳐한 화면입니다.

 

사이드에 에디터에서 작성한 제목만 뽑아서 보여줍니다. 

 

1. 스코롤시에 위치에 따라 액티브 됨.

2. 서브 헤딩인 경우는 접혀져 있다가 때가 되면 펼쳐지는 것..

 

둘다 모두 자바 스크립트로 가능한 것 같습니다.

 

개발자쪽은 모든 것을 마크다운 에디터에서 처리합니다.

 

코드를 보면  에디터 출력화면을 출력과  사이드 화면을 거의 동시에 렌더링합니다. https://github.com/Vanessa219/vditor/blob/master/demo/static-preview.html

 

<div id="previewWrap">
    <div id="preview" class="preview"></div>
</div>
<div class="vditor" style="border: 0">
    <div id="outline" class="vditor-reset"></div>
</div>

 

 after () {
   Vditor.outlineRender(document.getElementById('preview'), document.getElementById('outline'))
 },

 

그누보드(PHP)에서 구현한다고 했을 때.(또는 다른 곳에서 보편적으로 구현할때..)

 

위의 방식은 너무 확장성이 없는 것 같고.. 

 

대신 어떤식으로 처리하면 좋을 까요?

 

애는

Vditor.outlineRender(document.getElementById('outline'))

 

outline에 직접 렌더링을 할 것이 아니라,  어레이 같은 것으로 받아서 처리하면 맞을 것 같은데.

그러면 메인 텍스트 화면도 변수로 받아서 같이 처리해야 될 것도 같고..

 

그래서 질문..  아래와 같이 구현을 할려고 하면,  어떤 방식이 가장 많이 사용을 할까요?

(구현된 예시코드등 알려주시면 고맙겠습니다.)

 

800595458_1588473217.628.gif

답변만 하셔도 기본적으로 50P,답변채택시 내공 포인트 200P 가 지급됩니다. 답변 마감일 :2020 년 5 월 31 일

댓글목록

profile_image

선구자님의 댓글

no_profile 선구자 쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물 kr 아이피 (116.♡.♡.11) 작성일

뭔가 복잡해 보이네요 ㅠㅠ

profile_image
채택완료

무와보님의 댓글

무와보 쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물 kr 아이피 (175.♡.♡.20) 작성일

우선 아래꺼는 제일 많이 본 것 중 하나가 scrollspy.js 입니다.
https://www.cssscript.com/scrollspy-smooth-scroll-library-scrollspy-js/
이 예제 참고하시면 될 것 같네요.

참 그리고 에디터게시판 뷰페이지의 내용이 개발자 콘솔에 그대로 나오는 것은 아직 console.log 부분을 살려놔서 그런거죠?

profile_image

마젠토님의 댓글의 댓글

마젠토 쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물 us 아이피 (47.♡.♡.2) 작성일

아마도.. 그럴수도  있습니다.  아니면 옵션에 debug가 true로 되어 있던지..

profile_image

마젠토님의 댓글

마젠토 쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물 us 아이피 (47.♡.♡.2) 작성일

마크다운가이드 웹사이트에 대한 Github은 https://github.com/mattcone/markdown-guide/  여기이네요..  여기 안을 찾아보니
https://afeld.github.io/bootstrap-toc/  이것을 사용한 것 같습니다.

※ 답변기간이 종료되어 추가 답변이 불가 합니다.
질문답변 목록
번호 포인트 제목 답변 글쓴이 조회 날짜
13 500 댓글+ 8 마젠토 쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물 12239 03-01
12 200 댓글+ 2 마젠토 쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물 16855 04-12
열람중 200 댓글+ 4 마젠토 쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물 20732 05-02
10 500 댓글+ 4 마젠토 쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물 19353 05-02
9 500 댓글+ 2 마젠토 쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물 22793 04-25
8 300 댓글+ 17 마젠토 쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물 30183 04-23
7 1000 댓글+ 10 마젠토 쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물 8863 04-13
6 200 댓글+ 8 마젠토 쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물 10329 03-20
5 200 댓글+ 7 마젠토 쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물 8871 09-06
4 200 댓글+ 3 마젠토 쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물 8292 08-13
3 200 댓글+ 7 마젠토 쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물 8672 08-13
2 200 댓글+ 2 마젠토 쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물 12049 08-12
1 200 댓글+ 6 마젠토 쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물 8929 08-10

검색

회원로그인

회원가입
QnA nanoomihost. dnsever. dnszi.

사이트 정보

포인트 정책
포인트 순위
사이트명 : 아파치존
개인정보관리책임자 : JOO SUNG

접속자집계

오늘
4,698
어제
8,496
최대
176,238
전체
3,299,204
Copyright © apachezone.com. All rights reserved.