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

올려주신 내용을 바탕으로 수정된 소스 및 추가 수정을 위한 해당 내용에 대한 설명을 첨부해 드립니다.


1. 마격기 위치 수정 (녹색으로 색칠한 부분)
쪽지 보내기 소스 중에 대량의 마진이 삽입되어 있는 것을 확인하였습니다.
(margin:130px 0px 0px 80px;) 해당 마진이 무슨 의도로 삽입된 것인지 몰라, 추가 수정을 최소화하기 위해서 마격기에도 마진을 추가하여 위치를 조정하였습니다.

세세한 위치를 조정하시길 원하시면 해당 마진값(각각 상/우/하/좌측 마진을 의미합니다.)을 수정해 주시면 됩니다.


2. 인장 이미지 추가 (노란색으로 색칠한 부분)
해당 부분은 배경 이미지로 하나만 삽입될 수 있게 되어 있어서, 범위 형태로 소스를 수정하였습니다. 각각은 주석(이미지 넣는 곳)을 참고해 주시면 됩니다. 이미지 소스 끝에는 가능한 width="100%"을 이용해 주시면 레이아아웃이 깨지는 증상을 방지할 수 있을 것입니다.


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

감사합니다.


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

<div data-inven-prevent="contextmenu,drag,select">

<!-- 전체 배경-->
<div data-inven-id="la_back" style="display: inline-block; width:453px; height:660px;background: url('http://www.randomurl.ze.am/?id=HKfvC1wp7jF')no-repeat 0 0/ 100%; color: #fbb2ab; border: 1px solid #fbb2ab;">


<!-- 배경 선택 버튼 -->
<div style="background: url(http://upload2.inven.co.kr/upload/2018/06/25/bbs/i15940136302.png); width: 45px; height: 50px; background-repeat:no-repeat; overflow: hidden; display: inline-block; cursor: pointer;margin:5px 405px;" data-inven-tooltip="#000000;#ffffff;배경 바꾸기!" data-inven-toggle="aide" data-inven-hide="injang,exp,injang2,injang3,injang4"></div>


<!-- 배경 영웅 선택 팝업, 팝업 위치는 바로 아래행의 마진 값을 조정해 주세요.-->
<div style="height:1px;overflow:show;margin-left:51px;margin-top:10px;">
<div style="display: none;overflow:hidden;border-radius: 6px; border: 1px solid #000000; width: 346px; height: 290px;" data-inven-id="aide" data-inven-hide="aide">
<div style="padding: 5px 12px; overflow-y: scroll; height: 290px;">

<!--
양식에 유의해 주세요. 따옴표를 잘못 삽입할 경우 오류가 발생할 수 있습니다.
<img src="버튼 주소" data-inven-click-css="{'la_back':{'background':'url(배경 이미지 주소)no-repeat 0 0 / 100%'}}">
-->

<img src="http://upload2.inven.co.kr/upload/2018/06/24/bbs/i15328981056.jpg" data-inven-click-css="{'la_back':{'background':'url(http://upload2.inven.co.kr/upload/2018/06/24/bbs/i15328981056.jpg)no-repeat 0 0 / 100%'}}" width="24">&nbsp;
<img src="http://upload2.inven.co.kr/upload/2018/06/24/bbs/i15347145400.jpg" data-inven-click-css="{'la_back':{'background':'url(http://upload2.inven.co.kr/upload/2018/06/24/bbs/i15347145400.jpg)no-repeat 0 0 / 100%'}}" width="24">&nbsp;
<img src="http://upload2.inven.co.kr/upload/2018/06/24/bbs/i15371477238.jpg" data-inven-click-css="{'la_back':{'background':'url(http://upload2.inven.co.kr/upload/2018/06/24/bbs/i15371477238.jpg)no-repeat 0 0 / 100%'}}" width="24">&nbsp;
<img src="http://upload2.inven.co.kr/upload/2018/06/25/bbs/i14449699653.jpg" data-inven-click-css="{'la_back':{'background':'url(http://upload2.inven.co.kr/upload/2018/06/25/bbs/i14449699653.jpg)no-repeat 0 0 / 100%'}}" width="24">&nbsp;
<img src="http://upload2.inven.co.kr/upload/2018/06/24/bbs/i15313801841.jpg" data-inven-click-css="{'la_back':{'background':'url(http://upload2.inven.co.kr/upload/2018/06/24/bbs/i15313801841.jpg)no-repeat 0 0 / 100%'}}" width="24">&nbsp;
<img src="http://upload2.inven.co.kr/upload/2018/06/24/bbs/i15391965406.jpg" data-inven-click-css="{'la_back':{'background':'url(http://upload2.inven.co.kr/upload/2018/06/24/bbs/i15391965406.jpg)no-repeat 0 0 / 100%'}}" width="24">&nbsp;
<img src="http://upload2.inven.co.kr/upload/2018/06/24/bbs/i13734433352.jpg" data-inven-click-css="{'la_back':{'background':'url(http://upload2.inven.co.kr/upload/2018/06/24/bbs/i13734433352.jpg)no-repeat 0 0 / 100%'}}" width="24">&nbsp;
<img src="http://upload2.inven.co.kr/upload/2018/06/24/bbs/i13738961501.png" data-inven-click-css="{'la_back':{'background':'url(http://upload2.inven.co.kr/upload/2018/06/24/bbs/i13738961501.png)no-repeat 0 0 / 100%'}}" width="24">&nbsp;
<img src="http://upload2.inven.co.kr/upload/2018/06/24/bbs/i13739985313.jpg" data-inven-click-css="{'la_back':{'background':'url(http://upload2.inven.co.kr/upload/2018/06/24/bbs/i13739985313.jpg)no-repeat 0 0 / 100%'}}" width="24">&nbsp;

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


<!--받은인장모음-->
<div style="height:1px;overflow:show;margin-left:55px;margin-top:0px;">
<div data-inven-id="injang" style="display: none;">
<div style="display: inline-block; padding: 4px 8px; background: url(http://upload2.inven.co.kr/upload/2015/11/25/bbs/i12387913663.png); border-radius: 3px; border: 2px solid rgb(0, 0, 0); width: 320px; height: 350px; overflow-y: scroll;" data-inven-id="inj">
<center><div style="margin: 2px;">

<a href="#" style="text-decoration:none;" data-inven-over-css="{'wow_seal':{'display':'block'},'mabi_seal':{'display':'none'},'base':{'display':'none'}}">
<img data-inven-tooltip="#000000;#ffffff;#000000;World of Warcraft" style="border-radius: 8px; margin: 3px 5px; border: 1px solid rgb(0, 105, 207); width: 50px; height: 50px;" src="http://upload.inven.co.kr/upload/2013/12/30/bbs/i3697370183.jpg">
</a>

<a href="#" style="text-decoration:none;" data-inven-over-css="{'mabi_seal':{'display':'block'},'wow_seal':{'display':'none'},'base':{'display':'none'}}">
<img data-inven-tooltip="#000000;#ffffff;#000000;마비노기영웅전" style="border-radius: 8px; margin: 3px 5px; border: 1px solid rgb(0, 105, 207); width: 50px; height: 50px;" src="http://upload.inven.co.kr/upload/2013/12/30/bbs/i0478173012.png">
</a>
<br>


<!-- 기본 이미지 -->
<div data-inven-id="base" style="width:300px;">
<img src="http://upload2.inven.co.kr/upload/2018/06/24/bbs/i15356610390.png" width="100%">
</div>

<!-- 와우 이미지 -->
<div data-inven-id="wow_seal" style="width:300px;display:none;">
<img src="http://upload.inven.co.kr/upload/2013/12/29/bbs/i4114702211.jpg" width="100%">
<!-- 와우 이미지 넣는 곳-->
</div>

<!-- 마영전 이미지 -->
<div data-inven-id="mabi_seal" style="width:300px;display:none;">
<img src="http://upload.inven.co.kr/upload/2013/12/29/bbs/i2852799070.jpg" width="100%">
<!-- 마영전 이미지 넣는곳-->
</div>

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

<!-- 하단 영역 위치 조정 영역, height 뒤의 값을 조정해서 아래 버튼의 위치를 조정하세요.-->
<div style="height:287px;">
</div>

<!-- 버튼 영역 -->

<td><!--인장-->
<table style="border:1px; margin:12px;">
<tbody><tr><td>
<a href="#" data-inven-toggle="injang" data-inven-hide="exp,aide,injang2,injang3,injang4" data-inven-tooltip="#000000;#ffffff;받은 인장"> <div style="width:80px; height:75px;display:inline-block;margin:180px 0px 0px 40px;background:url(http://upload2.inven.co.kr/upload/2018/06/25/bbs/i15154988344.png);"></div></a></td><td>

<td><!--마격-->
<a href="#" data-inven-tooltip="#000000;#ffffff;마무리 일격!"><div style="background: url(http://upload2.inven.co.kr/upload/2018/06/25/bbs/i14263765618.png); width: 80px; height: 75px; display:inline-block;margin:175px 0px 0px 35px;"><div data-inven-action="" style="width: 140px; height: 55px; color: rgba(255, 255, 255, 0); opacity: 0; border: 0px; transition: 0.5s; padding: 0px; margin: 0px;" data-inven-over-css="{'_SELF_':{'opacity':'1'}}" data-inven-out-css="{'_SELF_':{'opacity':'0'}}" data-inven-nick-default="나이팅게이"><span data-inven-attr-for="input" style="display:none;"></span><span data-inven-attr-for="last-attack-all" style="background-color:rgba(255,255,255,0); width: 140px; height: 55px; font-size:0px; border:none;"></span></div></div></a></td><td>

<td><!--쪽지보내기-->
<a href="http://www.inven.co.kr/member/note/?act=write&amp;rurl=close&amp;nick=%EB%82%98%EC%9D%B4%ED%8C%85%EA%B2%8C%EC%9D%B4" style="text-decoration:none;" target="_blank" data-inven-tooltip="#000000;#ffffff;쪽지 보내기"><div style="width:137px; height:140px;display:inline-block;margin:130px 0px 0px 40px;background:url(http://upload2.inven.co.kr/upload/2018/06/25/bbs/i14763217909.png);"></div></a></td></tr></tbody></table></div></div></tr></table>