[기타] '하이바라냥이'님이 문의하신 스크립트 입니다.

인벤 스크립트에 관심을 가져주셔서 감사합니다.

올려주신 내용을 바탕으로 수정된 소스를 전달 드립니다.

혹시 원하시던 형태와 다르거나, 이외에도 궁금하신 내용은 언제든지 글 남겨주세요.

감사합니다.


■ HTML을 누른 상태에서 붙여넣어 주세요.

---

<!--색깔배경-->
<div data-inven-tabs style="background-color: #fbeff7;">

<!--움짤배경-->
<div style="background-image: url('https://upload2.inven.co.kr/upload/2017/09/16/bbs/i16267698222.gif');">

<!--이미지배경-->
<div style="background: url('https://upload2.inven.co.kr/upload/2017/09/16/bbs/i14402695556.png')no-repeat 0px bottom; min-height: 461px;">


<!--인장검색기-->
<div style="display:-moz-inline-stack; display:inline-block; zoom:1; *display:inline; background-image: url('https://upload2.inven.co.kr/upload/2015/03/02/bbs/i2612834329.png'); margin-top: 6px; margin-left: 6px; color: #ff99ab; border-radius: 6px; border: 1px solid #ff99ab; overflow: hidden; font-size: 11px; padding: 0;" data-inven-action="last-attack-10,last-attack-20,last-attack-all,search-profile" data-no-tooltip data-inven-result-detail data-inven-nick-default="하이바라냥이" data-inven-align ="center">
<span data-inven-attr-for="input" style="float: left; margin: 2px 1px 0 4px; width: 130px; font-size: 11px; color: #000000; padding: 0 2px; height: 17px;"></span>
<span data-inven-attr-for="button" data-inven-over-css="{'_SELF_':{'backgroundColor':'#ffccd4'}}" data-inven-out-css="{'_SELF_':{'backgroundColor':'#ff99ab'}}" style="float: left; margin: 0 0 0 1px; padding: 6px 4px 4px 4px; background-color: #ff99ab; color: white; border: 0; font-size: 11px; line-height: 100%; height: auto; transition: all 0.1s;"></span>
<span data-inven-attr-for="action-result" data-position="out" data-remain-result style="background-image: url('https://upload2.inven.co.kr/upload/2015/03/02/bbs/i2612834329.png'); margin-top: 2px; margin-left: 6px; color: #ff99ab; border-radius: 6px; border: 1px solid #ff99ab; padding: 4px 6px; font-size: 11px; width: 300px;"></span>
</div>

<div style="padding-top: 16px;">

<!-- 좌단 메뉴 -->
<div style="float: left;">
<div data-inven-tab-for="0" style="background: url('https://upload2.inven.co.kr/upload/2017/09/19/bbs/i16087345609.png') 0% 0% / 100%; margin: 15px 15px 0px; border-radius: 15px; border: 3px solid white; border-image: none; width: 96px; height: 96px; overflow: hidden; display: inline-block;">
<div style="transition:0.4s; width: 96px; height: 96px; text-align: center; color: rgba(255, 255, 255, 0); vertical-align: middle; display: table-cell;" data-inven-over-css="{'_SELF_':{'background-color':'#ffccd4','color':'rgba(255,255,255,1)'}}" data-inven-out-css="{'_SELF_':{'background-color':'rgba(255,255,255,0)','color':'rgba(255,255,255,0)'}}" data-inven-toggle="prof">
<div style="padding: 0.8em;" >프로필</div>
</div></div>

<br><br>

<div data-inven-tab-for="1" style="background: url('https://upload2.inven.co.kr/upload/2017/09/19/bbs/i16087345609.png') 0% 0% / 100%; margin: 15px 15px 0px; border-radius: 15px; border: 3px solid white; border-image: none; width: 96px; height: 96px; overflow: hidden; display: inline-block;">
<div style="transition:0.4s; width: 96px; height: 96px; text-align: center; color: rgba(255, 255, 255, 0); vertical-align: middle; display: table-cell;" data-inven-over-css="{'_SELF_':{'background-color':'#ffccd4','color':'rgba(255,255,255,1)'}}" data-inven-out-css="{'_SELF_':{'background-color':'rgba(255,255,255,0)','color':'rgba(255,255,255,0)'}}" data-inven-toggle="exp">
<div style="padding: 0.8em;" >경험치표</div>
</div></div>

<br><br>

<div data-inven-tab-for="2" style="background: url('https://upload2.inven.co.kr/upload/2017/09/19/bbs/i16087345609.png') 0% 0% / 100%; margin: 15px 15px 0px; border-radius: 15px; border: 3px solid white; border-image: none; width: 96px; height: 96px; overflow: hidden; display: inline-block;">
<div style="transition:0.4s; width: 96px; height: 96px; text-align: center; color: rgba(255, 255, 255, 0); vertical-align: middle; display: table-cell;" data-inven-over-css="{'_SELF_':{'background-color':'#ffccd4','color':'rgba(255,255,255,1)'}}" data-inven-out-css="{'_SELF_':{'background-color':'rgba(255,255,255,0)','color':'rgba(255,255,255,0)'}}" data-inven-toggle="seal">
<div style="padding: 0.8em;">받은 인장</div>
</div></div>
<br>
</div>


<div style="margin-left: 146px; margin-top: 16px; padding-bottom: 12px;">

<div data-inven-tab-id="0" style="min-height: 300px;"><!--메인 메뉴 내용-->
<div style="display: none; width: 204px; background-image: url('https://upload2.inven.co.kr/upload/2015/11/25/bbs/i12387913663.png'); border-radius: 6px; border: 1px solid #fbb2ab;" data-inven-id="prof">
<div style="border-bottom: 1px solid #fbb2ab; color: #fbb2ab;padding: 4px 8px; font-weight: bold;">하이바라 아이</div>
<div style="padding: 4px 8px;">
~~~공사중~~~
</div>
</div>
</div>

<div data-inven-tab-id="1" style="display: none;"><!--메뉴 1 내용-->
<div style="display: inline-block; padding: 4px 8px; background-image: url('https://upload2.inven.co.kr/upload/2015/11/25/bbs/i12387913663.png'); border-radius: 6px; border: 1px solid #fbb2ab;" data-inven-id="exp">
~~~공사중~~~
</div>
</div>

</div></div></div>


<div data-inven-tab-id="2" style="display: none;margin:10px;padding-bottom:10px;"><!--메뉴 2 내용-->
<div style="display: inline-block; padding: 4px 8px; background-image: url('https://upload2.inven.co.kr/upload/2015/11/25/bbs/i12387913663.png'); border-radius: 6px; border: 1px solid #fbb2ab;" data-inven-id="seal">
~~~공사중2~~~<br><br>
display:inline-block 스타일을 사용하였기 때문에, 안에 들어가는 내용에 따라서 상자의 가로폭이 조정됩니다.<br>
width 스타일에 값을 입력해서 가로폭을 고정할 수 있습니다.<br>
</div>
</div>

</div></div>