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 일

댓글목록 4

선구자님의 댓글

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

뭔가 복잡해 보이네요 ㅠㅠ

[답변채택]

무와보님의 댓글

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

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

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

마젠토님의 댓글의 댓글

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

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

마젠토님의 댓글

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

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

※ 답변기간이 종료되어 추가 답변이 불가 합니다.




전체 13건 1 페이지
게시물 검색
Copyright © apachezone.com. All rights reserved.

사이트 정보

사이트명 : apachezone.com
개인정보관리책임자 : JOO SUNG

PC 버전으로 보기