Notice
Recent Posts
Recent Comments
CrashOverride 잡동사니 !!
블로그에서 글 내용 펼치기, 접기 본문
요즈음 모든 블로그에는 글 내용을 펼치거나 접을 수 있는 기능을
손쉽게 이용할 수 있도록 '요약글' 이라는 기능을 제공한다.
하지만 기본 제공되는 기능이 디자인을 비롯한 여러 가지 요인들로 인해서
마음에 들지 않을 때 사용해볼만한 팁이다.
아래와 같은 몇 줄의 'HTML'과 'Java Script'가 혼합된 코드를 사용하면 된다.
------------------------------------------------------------------------------
<span id="more" style="CURSOR: hand" onclick="if(story.style.display=='none') {story.style.display='';more.innerText='>접기'} else {story.style.display='none';more.innerText='>펼치기'}">>펼치기</span>
<div id="story" style="display: none"><HR>이곳에 필요한 내용을 입력하면 된다.<HR></div>
------------------------------------------------------------------------------
이것을 적용한 예제는 아래와 같다.
>펼치기
이곳에 필요한 내용을 입력하면 된다.
단, 내용입력 부분에서 사용된 hr 태그는 기호에 따라서 써도 그만 안 써도 그만이다.
현재와 같이 펼쳐진 상태에서 상/하단에 줄을 표시하기 위해서 hr 태그를 사용한 것이다.
출처 :: 大家好 - 네이버 카페
1. http://cafe.naver.com/ainizhongguo/325
2. 검색 결과 화면
└ 카페 게시물은 외부로 링크하면 로그인을 요청하는 관계상 필요에 의해서
검색 결과 페이지를 추가로 링크함
손쉽게 이용할 수 있도록 '요약글' 이라는 기능을 제공한다.
하지만 기본 제공되는 기능이 디자인을 비롯한 여러 가지 요인들로 인해서
마음에 들지 않을 때 사용해볼만한 팁이다.
아래와 같은 몇 줄의 'HTML'과 'Java Script'가 혼합된 코드를 사용하면 된다.
------------------------------------------------------------------------------
<span id="more" style="CURSOR: hand" onclick="if(story.style.display=='none') {story.style.display='';more.innerText='>접기'} else {story.style.display='none';more.innerText='>펼치기'}">>펼치기</span>
<div id="story" style="display: none"><HR>이곳에 필요한 내용을 입력하면 된다.<HR></div>
------------------------------------------------------------------------------
이것을 적용한 예제는 아래와 같다.
>펼치기
이곳에 필요한 내용을 입력하면 된다.
단, 내용입력 부분에서 사용된 hr 태그는 기호에 따라서 써도 그만 안 써도 그만이다.
현재와 같이 펼쳐진 상태에서 상/하단에 줄을 표시하기 위해서 hr 태그를 사용한 것이다.
출처 :: 大家好 - 네이버 카페
1. http://cafe.naver.com/ainizhongguo/325
2. 검색 결과 화면
└ 카페 게시물은 외부로 링크하면 로그인을 요청하는 관계상 필요에 의해서
검색 결과 페이지를 추가로 링크함
Comments