Want
2017-12-06 23:13
조회: 834
추천: 0
답변입니다.우선, 정리한 소스코드입니다.
*~ -------------------------------------------------------------------------------- ~* <div data-inven-action="last-attack-1,last-attack-5,last-attack-10,last-attack-20,last-attack-all,search-profile" data-inven-label="마격/인장검색" data-inven-nick-default="켄로" data-no-tooltip="" data-inven-result-detail=""> </div> <div style="text-align: center;"> <p align="center" style="line-height: 1.4; font-family: gulim, 굴림, Helvetica;"> <img src="https://upload2.inven.co.kr/upload/2016/02/10/bbs/i11990177534.gif" width="438"> </p> <div style="text-align: center;"> <font face="Arial" size="2"> <i>켄로 유튜브: https://plus.google.com/105209448622815839199</i> </font> </div> <div style="text-align: center; line-height: 16.8px;"> <i style="font-family: Arial; font-size: large;"><b><font color="#0b5394"><br></font></b></i> </div> <div style="text-align: center; line-height: 16.8px;"> <i style="font-family: Arial; font-size: large;"><b><font color="#0b5394">Victory is upon us</font></b></i> </div> <div style="text-align: center; line-height: 16.8px;"><br> </div> <div style="text-align: center; line-height: 16.8px;"> <font size="4" face="Arial" color="#ff0000"> <span style="line-height: 25.2px;"> <i><b><img src="https://upload2.inven.co.kr/upload/2016/10/07/bbs/i11712456249.png" border="0"><br></b></i> </span> </font> </div> <div style="text-align: center; line-height: 16.8px;"> <font size="4" face="Arial" color="#3d85c6"> <span style="line-height: 25.2px;"> <i><b>by.Miya</b></i> </span> </font> </div> <div style="text-align: center;"> <img src="https://upload2.inven.co.kr/upload/2016/10/07/bbs/i13308648599.png" border="0" width="438"><br> </div> <div style="text-align: center;"> <div style="line-height: 16.8px;"><font size="4" face="Arial" color="#3d85c6"> <span style="line-height: 25.2px;"> <i><b>by.안소</b></i> </span> </font> </div> <div> <img src="https://upload2.inven.co.kr/upload/2016/04/17/bbs/i13099508614.png" border="0" style="font-size: 9pt;"> </div> <div> <div style="line-height: 16.8px;"> <font size="4" face="Arial" color="#3d85c6"> <span style="line-height: 25.2px;"><i><b>by.마도카</b></i> </span> </font> </div> </div> </div> </div> <div style="text-align: center;"> <strike><img src="https://upload2.inven.co.kr/upload/2015/07/28/bbs/i10701327045.png" border="0" width="438"></strike> </div> <div style="text-align: center;"> <i style="color: #3d85c6; font-family: Arial; font-size: large;"><b>by.파란달</b></i> </div> <div style="text-align: center;"> <i style="color: #3d85c6; font-family: Arial; font-size: large;"><b><br></b></i> </div> <strike> <div style="text-align: center;"> <strike style="line-height: 1.4;"> <font size="2" color="#0b5394">샤티@아란제비아 하리하라 연합<백제원정대></font> </strike> </div> </strike> <div> <div style="text-align: center;"> <span style="line-height: 1.4;"> <strike> <font size="2" color="#0b5394">샤티@아란제비아 East <투 혼></font> </strike> </span> </div> <div style="text-align: center;"> <strike><font size="2" color="#0b5394">샤티@아란제비아 East <검은띠></font></strike> </div> <div style="text-align: center;"><font size="2" color="#0b5394"> <span style="line-height: 18px;"> <strike><br></strike> </span> </font> </div> <div style="text-align: center;"> <strike><font size="2" color="#0b5394">랑아@안탈론 하리하라 연합</font></strike> </div> <div style="text-align: center;"> <strike><font size="2" color="#0b5394">랑아@안탈론 하리하라 연합 <슈퍼맨이 돌아왔다></font></strike> </div> <div style="text-align: center;"> <span style="line-height: 1.4;"> <strike><font size="2" color="#0b5394">랑아@안탈론 하리하라 연합 <초로기></font></strike> </span> </div> <div style="text-align: center;"> <span style="line-height: 1.4;"> <strike><font size="2" color="#0b5394">랑아@안탈론 동 대 <미공개></font></strike> </span> </div> <div style="text-align: center;"> <span style="line-height: 1.4;"> <strike><font size="2" color="#0b5394">랑아@안탈론 동 대 <패거리></font></strike> </span> </div> <div style="text-align: center;"> <span style="line-height: 1.4;"> <strike><font size="2" color="#0b5394">랑아@안탈론 태초 <도 박></font></strike> </span> </div> <div style="text-align: center;"> <span style="line-height: 1.4;"><strike><font size="2" color="#0b5394">랑아@안탈론 하리하라 연합 <투 혼></font></strike> </span> </div> </div> <div style="text-align: center;"> <span style="line-height: 1.4;"> <strike><font size="2" color="#0b5394"><br></font></strike> </span> </div> <div style="text-align: center;"> <strike style="line-height: 1.4;"><font size="2" color="#0b5394">검랑@크라켄 참교육 <특수반></font></strike> </div> <div style="text-align: center;"> <strike><font size="2" color="#0b5394">검랑@크라켄 참교육 <선도부></font></strike> </div> <div style="text-align: center;"> <strike><font size="2" color="#0b5394"><br></font></strike> </div> <div style="text-align: center;"> <strike style="line-height: 1.4;"><font size="2" color="#0b5394">켄로@안탈론 안다미로 <폭 주></font></strike> </div> <div style="text-align: center;"> <strike style="line-height: 1.4;"><font size="2" color="#0b5394"><br></font></strike> </div> <div style="text-align: center;"> <span style="line-height: 1.4;"> <font size="2" color="#0b5394"><strike>켄로@누이 리 셋 <서비스종료></strike></font> </span> </div> <div style="text-align: center;"> <font size="2" color="#0b5394"> <span style="line-height: 18px;"><strike>켄로@누이 리 셋<그래서 공대장이 누군데></strike> </span> </font> </div> <div style="text-align: center;"> <font size="2" color="#0b5394"> <span style="line-height: 18px;"> <strike>켄로@누이 리 셋<서비스종료></strike> </span> </font> </div> <div style="text-align: center;"> <font size="2" color="#0b5394"> <span style="line-height: 18px;"> <strike><br></strike> </span> </font> </div> <div style="text-align: center;"> <span style="line-height: 1.4;"> <font size="4" color="#0b5394"><b><i>켄로@누이 하리하라 연합<당근수수></i></b></font> </span> </div> <div style="text-align: center;"> <span style="line-height: 1.4;"> <font size="4" color="#990000"><b><i><br></i></b></font> </span> </div> <div style="text-align: center;"> <span style="line-height: 1.4;"> <font size="4" color="#990000"><b><i>2016.10.11 End</i></b></font> </span> </div> <div style="text-align: center;"> <font color="#990000" size="4"> <span style="line-height: 25.2px;"><b><i>Restart 2018.07.10</i></b> </span> </font> </div> <div style="text-align: center;"><b style="color: #3d85c6; font-size: large; line-height: 1.4;"> <a href="#" data-inven-toggle="seal">인장 펼치고/접기</a></b> </div> *~ -------------------------------------------------------------------------------- ~* *~ -------------------------------------------------------------------------------- ~* 접고 펼치는 기능인 data-inven-toggle에 대해 설명드리겠습니다. data-inven-toggle="id값" 으로 구성되며, 이 속성은 id값을 data-inven-id의 값으로 갖는 태그를 타겟으로 하여 타겟이 되는 태그를 보여주고 숨기는 기능을 갖습니다. 보이는 기능만을 갖는 data-inven-show와 숨기는 기능만을 갖는 data-inven-hide가 합쳐진 형태입니다. 그런데 중요한 점은, '타겟'이 되는 태그가 있어야 한다는 점입니다. data-inven-toggle="id값"에 해당되는 id값을 갖는 data-inven-id="id값" 태그가 없다면, 아무런 기능도 없는 것과 마찬가지입니다. 따라서, 위 소스 코드의 문제점은 타겟 id를 갖는 태그가 없기에 토글이 작동하지 않는다는 것이지요. 소스 코드를 수정하여, Victory is upon us 부분부터 맨 끝까지 접고 펼칠 수 있도록 해보겠습니다. *~ -------------------------------------------------------------------------------- ~* *~ -------------------------------------------------------------------------------- ~* <div data-inven-action="last-attack-1,last-attack-5,last-attack-10,last-attack-20,last-attack-all,search-profile" data-inven-label="마격/인장검색" data-inven-nick-default="켄로" data-no-tooltip="" data-inven-result-detail=""> </div> <div style="text-align: center;"> <p align="center" style="line-height: 1.4; font-family: gulim, 굴림, Helvetica;"> <img src="https://upload2.inven.co.kr/upload/2016/02/10/bbs/i11990177534.gif" width="438"> </p> <div style="text-align: center;"> <font face="Arial" size="2"> <i>켄로 유튜브: https://plus.google.com/105209448622815839199</i> </font> </div> <div data-inven-id="seal"> <!-- SEAL Start --> <div style="text-align: center; line-height: 16.8px;"> <i style="font-family: Arial; font-size: large;"><b><font color="#0b5394"><br></font></b></i> </div> <div style="text-align: center; line-height: 16.8px;"> <i style="font-family: Arial; font-size: large;"><b><font color="#0b5394">Victory is upon us</font></b></i> </div> <div style="text-align: center; line-height: 16.8px;"><br> </div> <div style="text-align: center; line-height: 16.8px;"> <font size="4" face="Arial" color="#ff0000"> <span style="line-height: 25.2px;"> <i><b><img src="https://upload2.inven.co.kr/upload/2016/10/07/bbs/i11712456249.png" border="0"><br></b></i> </span> </font> </div> <div style="text-align: center; line-height: 16.8px;"> <font size="4" face="Arial" color="#3d85c6"> <span style="line-height: 25.2px;"> <i><b>by.Miya</b></i> </span> </font> </div> <div style="text-align: center;"> <img src="https://upload2.inven.co.kr/upload/2016/10/07/bbs/i13308648599.png" border="0" width="438"><br> </div> <div style="text-align: center;"> <div style="line-height: 16.8px;"> <font size="4" face="Arial" color="#3d85c6"> <span style="line-height: 25.2px;"> <i><b>by.안소</b></i> </span> </font> </div> <div> <img src="https://upload2.inven.co.kr/upload/2016/04/17/bbs/i13099508614.png" border="0" style="font-size: 9pt;"> </div> <div style="line-height: 16.8px;"> <font size="4" face="Arial" color="#3d85c6"> <span style="line-height: 25.2px;"> <i><b>by.마도카</b></i> </span> </font> </div> </div> <div style="text-align: center;"> <strike><img src="https://upload2.inven.co.kr/upload/2015/07/28/bbs/i10701327045.png" border="0" width="438"></strike> </div> <div style="text-align: center;"> <i style="color: #3d85c6; font-family: Arial; font-size: large;"><b>by.파란달</b></i> </div> <div style="text-align: center;"> <i style="color: #3d85c6; font-family: Arial; font-size: large;"><b><br></b></i> </div> <strike> <div style="text-align: center;"> <strike style="line-height: 1.4;"> <font size="2" color="#0b5394">샤티@아란제비아 하리하라 연합<백제원정대></font> </strike> </div> </strike> <div> <div style="text-align: center;"> <span style="line-height: 1.4;"> <strike> <font size="2" color="#0b5394">샤티@아란제비아 East <투 혼></font> </strike> </span> </div> <div style="text-align: center;"> <strike><font size="2" color="#0b5394">샤티@아란제비아 East <검은띠></font></strike> </div> <div style="text-align: center;"><font size="2" color="#0b5394"> <span style="line-height: 18px;"> <strike><br></strike> </span> </font> </div> <div style="text-align: center;"> <strike><font size="2" color="#0b5394">랑아@안탈론 하리하라 연합</font></strike> </div> <div style="text-align: center;"> <strike><font size="2" color="#0b5394">랑아@안탈론 하리하라 연합 <슈퍼맨이 돌아왔다></font></strike> </div> <div style="text-align: center;"> <span style="line-height: 1.4;"> <strike><font size="2" color="#0b5394">랑아@안탈론 하리하라 연합 <초로기></font></strike> </span> </div> <div style="text-align: center;"> <span style="line-height: 1.4;"> <strike><font size="2" color="#0b5394">랑아@안탈론 동 대 <미공개></font></strike> </span> </div> <div style="text-align: center;"> <span style="line-height: 1.4;"> <strike><font size="2" color="#0b5394">랑아@안탈론 동 대 <패거리></font></strike> </span> </div> <div style="text-align: center;"> <span style="line-height: 1.4;"> <strike><font size="2" color="#0b5394">랑아@안탈론 태초 <도 박></font></strike> </span> </div> <div style="text-align: center;"> <span style="line-height: 1.4;"><strike><font size="2" color="#0b5394">랑아@안탈론 하리하라 연합 <투 혼></font></strike> </span> </div> </div> <div style="text-align: center;"> <span style="line-height: 1.4;"> <strike><font size="2" color="#0b5394"><br></font></strike> </span> </div> <div style="text-align: center;"> <strike style="line-height: 1.4;"><font size="2" color="#0b5394">검랑@크라켄 참교육 <특수반></font></strike> </div> <div style="text-align: center;"> <strike><font size="2" color="#0b5394">검랑@크라켄 참교육 <선도부></font></strike> </div> <div style="text-align: center;"> <strike><font size="2" color="#0b5394"><br></font></strike> </div> <div style="text-align: center;"> <strike style="line-height: 1.4;"><font size="2" color="#0b5394">켄로@안탈론 안다미로 <폭 주></font></strike> </div> <div style="text-align: center;"> <strike style="line-height: 1.4;"><font size="2" color="#0b5394"><br></font></strike> </div> <div style="text-align: center;"> <span style="line-height: 1.4;"> <font size="2" color="#0b5394"><strike>켄로@누이 리 셋 <서비스종료></strike></font> </span> </div> <div style="text-align: center;"> <font size="2" color="#0b5394"> <span style="line-height: 18px;"><strike>켄로@누이 리 셋<그래서 공대장이 누군데></strike> </span> </font> </div> <div style="text-align: center;"> <font size="2" color="#0b5394"> <span style="line-height: 18px;"> <strike>켄로@누이 리 셋<서비스종료></strike> </span> </font> </div> <div style="text-align: center;"> <font size="2" color="#0b5394"> <span style="line-height: 18px;"> <strike><br></strike> </span> </font> </div> <div style="text-align: center;"> <span style="line-height: 1.4;"> <font size="4" color="#0b5394"><b><i>켄로@누이 하리하라 연합<당근수수></i></b></font> </span> </div> <div style="text-align: center;"> <span style="line-height: 1.4;"> <font size="4" color="#990000"><b><i><br></i></b></font> </span> </div> <div style="text-align: center;"> <span style="line-height: 1.4;"> <font size="4" color="#990000"><b><i>2016.10.11 End</i></b></font> </span> </div> <div style="text-align: center;"> <font color="#990000" size="4"> <span style="line-height: 25.2px;"><b><i>Restart 2018.07.10</i></b> </span> </font> </div> </div> <!-- SEAL End --> <div style="text-align: center;"><b style="color: #3d85c6; font-size: large; line-height: 1.4;"> <a href="#" data-inven-toggle="seal">인장 펼치고/접기</a></b> </div> *~ -------------------------------------------------------------------------------- ~* 켄로 유튜브: https://plus.google.com/105209448622815839199 Victory is upon us by.Miya by.안소 by.마도카 by.파란달 켄로@누이 하리하라 연합<당근수수> 2016.10.11 End Restart 2018.07.10 접고 펼칠 대상이 될 구간의 시작 부분에는 <div data-inven-id="seal"> 로 id 값이 지정된 div태그를 열고, 끝 부분에는 </div>로 div 태그를 닫아주어 접고 펼쳐질 구간을 지정했습니다. 접고 펼칠 구간을 다르게 하고 싶으시다면, 댓글이나 쪽지 남겨주시기 바랍니다 :) + 처음부터 접힌 채로 보이게 할 수도 있습니다. <div data-inven-id="seal"> 이 부분을 <div data-inven-id="seal" style="display:none;"> 이렇게 수정해주시면 됩니다. |