Nacx
2017-05-10 15:03
조회: 497
추천: 0
'질풍의라빈'님이 문의하신 스크립트 입니다.인벤 스크립트에 관심을 가져주셔서 감사합니다.
메우님의 탭 소스를 가로 방향으로 출력하는 것과 관련하여 문의 주셨는데요. 샘플 소스를 작성하여 전달 드립니다. 혹시 원하시던 형태와 다르거나, 이외에도 궁금하신 내용은 언제든지 글 남겨주세요. 감사합니다. ■ HTML을 누른 상태에서 붙여넣어 주세요. <div data-inven-tabs> <!-- 탭 버튼 첫번째 줄 --> <div style="position:relative;height:26px;overflow:hidden;margin-bottom:4px;"> <div data-inven-tab-for="0" data-inven-selected-css="{'_SELF_':{'top':'0px'}}" data-inven-unselected-css="{'_SELF_':{'top':'4px'}}" style="display:inline-block;position:relative;top:0px;padding: 4px 8px 8px 8px; border-radius: 6px 6px 0px 0px; background-color: #fbb2ab; color: white;">기록</div> <div data-inven-tab-for="1" data-inven-selected-css="{'_SELF_':{'top':'0px'}}" data-inven-unselected-css="{'_SELF_':{'top':'4px'}}" style="display:inline-block;position:relative;top:4px;padding: 4px 8px 8px 8px; border-radius: 6px 6px 0px 0px; background-color: #fbb2ab; color: white;">경험치표</div> <div data-inven-tab-for="2" data-inven-selected-css="{'_SELF_':{'top':'0px'}}" data-inven-unselected-css="{'_SELF_':{'top':'4px'}}" style="display:inline-block;position:relative;top:4px;padding: 4px 8px 8px 8px; border-radius: 6px 6px 0px 0px; background-color: #fbb2ab; color: white;">특수기능</div> <div data-inven-tab-for="3" data-inven-selected-css="{'_SELF_':{'top':'0px'}}" data-inven-unselected-css="{'_SELF_':{'top':'4px'}}" style="display:inline-block;position:relative;top:4px;padding: 4px 8px 8px 8px; border-radius: 6px 6px 0px 0px; background-color: #fbb2ab; color: white;">문의</div> </div> <!-- 탭 버튼 두번째 줄 --> <div style="position:relative;height:26px;overflow:hidden;margin-bottom:4px;"> <div data-inven-tab-for="4" data-inven-selected-css="{'_SELF_':{'top':'0px'}}" data-inven-unselected-css="{'_SELF_':{'top':'4px'}}" style="display:inline-block;position:relative;top:0px;padding: 4px 8px 8px 8px; border-radius: 6px 6px 0px 0px; background-color: #fbb2ab; color: white;">기록1</div> <div data-inven-tab-for="5" data-inven-selected-css="{'_SELF_':{'top':'0px'}}" data-inven-unselected-css="{'_SELF_':{'top':'4px'}}" style="display:inline-block;position:relative;top:4px;padding: 4px 8px 8px 8px; border-radius: 6px 6px 0px 0px; background-color: #fbb2ab; color: white;">경험치표1</div> <div data-inven-tab-for="6" data-inven-selected-css="{'_SELF_':{'top':'0px'}}" data-inven-unselected-css="{'_SELF_':{'top':'4px'}}" style="display:inline-block;position:relative;top:4px;padding: 4px 8px 8px 8px; border-radius: 6px 6px 0px 0px; background-color: #fbb2ab; color: white;">특수기능1</div> <div data-inven-tab-for="7" data-inven-selected-css="{'_SELF_':{'top':'0px'}}" data-inven-unselected-css="{'_SELF_':{'top':'4px'}}" style="display:inline-block;position:relative;top:4px;padding: 4px 8px 8px 8px; border-radius: 6px 6px 0px 0px; background-color: #fbb2ab; color: white;">문의1</div> </div> <!-- 탭 본문 영역--> <div data-inven-tab-id="0" style="min-height: 300px;"> 기록 내용</div> <div data-inven-tab-id="1" style="display: none;"> 경험치표 내용</div> <div data-inven-tab-id="2" style="display: none;"> 특수기능 내용</div> <div data-inven-tab-id="3" style="display: none;"> 문의 내용</div> <div data-inven-tab-id="4" style="display: none;"> 기록1 내용</div> <div data-inven-tab-id="5" style="display: none;"> 경험치표1 내용</div> <div data-inven-tab-id="6" style="display: none;"> 특수기능1 내용</div> <div data-inven-tab-id="7" style="display: none;"> 문의1 내용</div> </div> |