●
●
●
●
●
●
●
●
●
●
●
● ●
●
● ●
●
●
●
●
●
●
●
●
●
●
● ●
●
● ●
●
●
●
●
●
●
●
●
●
●
● ●
●
● ●
●
●
●
●
●
●
●
●
●
●
● ●
●
● ●
●
●
●
●
●
●
●
●
●
●
● ●
●
● ●
●
●
●
●
●
●
●
●
●
●
● ●
●
●
-------------------------------------------------------------------------------------------------------
안녕하세요?
이번에 인장을 꾸미게 된 인장초보입니다. ㅠㅠ
다름아니라 인장수정을하는데... 가입일 계산기 글씨가 아무리해도 색깔이 제대로 안바뀌더라구요. ㅠㅠ
아래 마격기와 같은 색깔로하고 싶은데...
그리고 좌측 박스들을이 세로로 해뒀는데 글씨도 세로인게 너무 지저분하고 장소만 차지하는거 같아서 글씨를 아래진행이 아닌 우측진행으로 바꾸고 박스크기를 맞춰서 늘려주고 싶은데... 어떻게 해야하는지 잘 이해가 안가네요.
★, Tera, Prius 부분에 글을 첨부하고 싶은데... 이것도 잘 안되네요. ㅠㅠ
그리고 스크롤을 아래로 내리는거는 인장사진이 안뚱뚱해보이는데
★, tera 소제목 인장은 뚱뚱해보여서 인장박스들을 전체적으로 살짝 늘리고 싶어요.
조언 좀 해주실 수 있나요??? ㅠㅠ
아래는 스크립트 입니다. ㅠㅠ
1. 가입일수 색깔을 마격계산기의 색깔처럼 핑크하게 바꾸고 싶어요.
2. 세로인장 소제목들 글씨를 우측으로 나열하고, 박스를 그 크기만큼 늘리고 싶어요.
3. ★, Tera, Prius 안에 글을 첨부하고 싶어요.
4. 소제목 눌렀을때 나오는 센터부분 인장박스를 아래로 살짝 늘리고 싶어요.
--------------------------------------------------------------------------------------------------------
<div style="background-image: url('https://upload2.inven.co.kr/upload/2015/03/02/bbs/i2612834329.png'); padding: 4px 6px;">
<div style="background: url('http://www.randomurl.ze.am/e/jd.php?d=2011-09-26 16:43:08&background-color: rgba(255, 255, 255, 0.5)#.png'); height: 20px;">
</div>
<div style="width:450px; height:500px; overflow:hidden;">
<!-- 인장 시작 부분 -->
<div style="display:block; float:left; background:none; font-size: 11px; width:450px; height:500px; position:relative; z-index:2;">
<!-- 마격기 시작 -->
<div align="center">
<div style="display:-moz-inline-stack; display:inline-block; zoom:1; *display:inline; background-color: rgba(255, 255, 255, 0.5); margin-top: 16px; margin-left:25px; color: #000000; border-radius: 10px; border: 1px solid rgba(255,128,192, 0.5); overflow:auto; font-size:
11px; padding: 1 1 1 1px; cursor:default;" data-inven-action="" data-no-tooltip="" data-inven-result-detail="" data-inven-nick-default="라크">
<span data-inven-attr-for="input" style="float: left; width: 100px; font-size: 11px; font-weight: bold; text-align:center; color:rgba(255,128,192, 1.0); background-color: rgba(255, 255, 255, 0.5); padding: 1 1 1 4px; height: 22px; line-height: 21px; border: 0; border-
radius:10px; cursor:default;">
</span>
<span data-inven-attr-for="last-attack-5" style="float: left; margin: 2 2 2 2px; padding: 4px 4px 4px 4px; background-color: rgba(255,128,192, 0.7); color: white; border-radius:5px; border: 0; font-size: 11px; line-height: 100%; height: auto;">
</span>
<span data-inven-attr-for="last-attack-10" style="float: left; margin: 2 2 2 2px; padding: 4px 4px 4px 4px; background-color: rgba(255,128,192, 0.8); color: white; border-radius:5px; border: 0; font-size: 11px; line-height: 100%; height: auto;">
</span>
<span data-inven-attr-for="last-attack-all" style="float: left; margin: 2 2 2 2px; padding: 4px 4px 4px 4px; background-color: rgba(255,128,192, 0.9); color: white; border-radius:5px; border: 0; font-size: 11px; line-height: 100%; height: auto;">
</span>
<span data-inven-attr-for="search-profile" style="float: left; margin: 2 2 2 2px; padding: 4px 4px 4px 4px; background-color: rgba(255,128,192, 1.0); color: white; border-radius:5px; border: 0; font-size: 11px; line-height: 100%; height: auto;">
</span>
<span data-inven-attr-for="action-result" data-position="out" style="background-color: rgba(255, 255, 255, 0.5); margin-top: 2px; margin-left: 33px; color: rgba(255,128,192, 1.0); border-radius: 6px; border: 1px solid rgba(255,128,192, 0.9); padding: 4px 6px; font-size:
11px; width: 300px;">
</span>
</div>
</div>
<!-- 마격기 끝 -->
<!-- TAB DIVISION OPEN -->
<div data-inven-tabs style="padding-top: 16px;">
<!-- LEFT MENU DIVISION OPEN -->
<div style="float: left; padding-top:3px;">
<div data-inven-tab-for="Tab1" data-inven-selected-css="{'_SELF_':{'paddingLeft':'6px', 'paddingRight':'2px', 'background-color':'rgba(255,128,192, 1.0)', 'color':'rgba(255, 255, 255, 1.0)'}}" data-inven-unselected-css="{'_SELF_':{'paddingLeft':'2px',
'paddingRight':'1px', 'background-color':'rgba(255, 255, 255, 1.0)', 'color':'rgba(255,128,192, 1.0)'}}"
data-inven-over-css="{'_SELF_':{'opacity':'0.7'}}"
data-inven-out-css="{'_SELF_':{'opacity':'1.0'}}" style="width: 12px; margin: 6px 0; padding: 4px 2px; border-radius: 0 6px 6px 0; background-color: rgba(255,128,192, 1.0); color: white; transition:0.2s ease-in-out; font-size: 12px; font-weight:bold; cursor: pointer;">★
</div>
<div data-inven-tab-for="Tab2" data-inven-selected-css="{'_SELF_':{'paddingLeft':'6px', 'paddingRight':'2px', 'background-color':'rgba(255,128,192, 1.0)', 'color':'rgba(255, 255, 255, 1.0)'}}" data-inven-unselected-css="{'_SELF_':{'paddingLeft':'2px',
'paddingRight':'1px', 'background-color':'rgba(255, 255, 255, 1.0)', 'color':'rgba(255,128,192, 1.0)'}}"
data-inven-over-css="{'_SELF_':{'opacity':'0.7'}}"
data-inven-out-css="{'_SELF_':{'opacity':'1.0'}}" style="width: 12px; margin: 6px 0; padding: 4px 2px; border-radius: 0 6px 6px 0; background-color: rgba(255,128,192, 1.0); color: white; transition:0.2s ease-in-out; font-size: 12px; font-weight:bold; cursor:
pointer;">Tera
</div>
<div data-inven-tab-for="Tab3" data-inven-selected-css="{'_SELF_':{'paddingLeft':'6px', 'paddingRight':'2px', 'background-color':'rgba(255,128,192, 1.0)', 'color':'rgba(255, 255, 255, 1.0)'}}" data-inven-unselected-css="{'_SELF_':{'paddingLeft':'2px',
'paddingRight':'1px', 'background-color':'rgba(255, 255, 255, 1.0)', 'color':'rgba(255,128,192, 1.0)'}}"
data-inven-over-css="{'_SELF_':{'opacity':'0.7'}}"
data-inven-out-css="{'_SELF_':{'opacity':'1.0'}}" style="width: 12px; margin: 6px 0; padding: 4px 2px; border-radius: 0 6px 6px 0; background-color: rgba(255,128,192, 1.0); color: white; transition:0.2s ease-in-out; font-size: 12px; font-weight:bold; cursor:
pointer;">Prius
</div>
<div data-inven-tab-for="Tab4" data-inven-selected-css="{'_SELF_':{'paddingLeft':'6px', 'paddingRight':'2px', 'background-color':'rgba(255,128,192, 1.0)', 'color':'rgba(255, 255, 255, 1.0)'}}" data-inven-unselected-css="{'_SELF_':{'paddingLeft':'2px',
'paddingRight':'1px', 'background-color':'rgba(255, 255, 255, 1.0)', 'color':'rgba(255,128,192, 1.0)'}}"
data-inven-over-css="{'_SELF_':{'opacity':'0.7'}}"
data-inven-out-css="{'_SELF_':{'opacity':'1.0'}}" style="width: 12px; margin: 6px 0; padding: 4px 2px; border-radius: 0 6px 6px 0; background-color: rgba(255,128,192, 1.0); color: white; transition:0.2s ease-in-out; font-size: 12px; font-weight:bold; cursor: pointer;">인
장
</div>
<div data-inven-tab-for="Tab5" data-inven-selected-css="{'_SELF_':{'paddingLeft':'6px', 'paddingRight':'2px', 'background-color':'rgba(255,128,192, 1.0)', 'color':'rgba(255, 255, 255, 1.0)'}}" data-inven-unselected-css="{'_SELF_':{'paddingLeft':'2px',
'paddingRight':'1px', 'background-color':'rgba(255, 255, 255, 1.0)', 'color':'rgba(255,128,192, 1.0)'}}"
data-inven-over-css="{'_SELF_':{'opacity':'0.7'}}"
data-inven-out-css="{'_SELF_':{'opacity':'1.0'}}" style="width: 12px; margin: 6px 0; padding: 4px 2px; border-radius: 0 6px 6px 0; background-color: rgba(255,128,192, 1.0); color: white; transition:0.2s ease-in-out; font-size: 12px; font-weight:bold; cursor: pointer;">글
씨
</div>
</div>
<!-- LEFT MENU DIVISION CLOSE -->
<!-- TAB CONTENTES DIVISION OPEN -->
<div style="margin-left: 40px; margin-top: 8px; padding-bottom: 0px;">
<!-- Tab1 내용 -->
<div data-inven-tab-id="Tab1" style="display: none;">
<div align="center" style="display: block; width: 390px; height:390px; background: rgba(255, 255, 255, 0.8); border-radius: 10px; border: 1px solid rgba(255,128,192, 1.0); overflow:hidden;">
<div style="display:block; width:390px; height:390px; border-radius:10px; background:url('https://upload2.inven.co.kr/upload/2018/03/03/bbs/i14725833292.gif') center / 370px 370px no-repeat;">
</div>
</div>
</div>
<!-- Tab2 내용 -->
<div data-inven-tab-id="Tab2" style="display: none;">
<div align="center" style="display: block; width: 390px; height:390px; background: rgba(255, 255, 255, 0.8); border-radius: 10px; border: 1px solid rgba(255,128,192, 1.0); overflow:hidden;">
<div style="display:block; width:390px; height:390px; border-radius:10px; background:url('https://upload2.inven.co.kr/upload/2018/03/03/bbs/i14714764291.gif') center / 370px 370px no-repeat;">
</div>
</div>
</div>
<!-- Tab3 내용 -->
<div data-inven-tab-id="Tab3" style="display: none;">
<div align="center" style="display: block; width: 390px; height:390px; background: rgba(255, 255, 255, 0.8); border-radius: 10px; border: 1px solid rgba(255,128,192, 1.0); overflow:hidden;">
<div style="display:block; width:390px; height:390px; border-radius:10px; background:url('https://upload2.inven.co.kr/upload/2018/03/03/bbs/i16504827552.jpg') center / 370px 370px no-repeat;">
</div>
</div>
</div>
<!-- Tab4 내용 -->
<div data-inven-tab-id="Tab4" style="display: none;">
<div style="display: block; width: 370px; height:380px; background: rgba(255, 255, 255, 0.8); border-radius: 10px; border: 1px solid rgba(255,128,192, 1.0); overflow:hidden; padding:10px 10px 0px 10px;"data-inven-tooltip="rgba(255, 255, 255, 1);rgba(255,128,192,
0.9);rgba(255, 255, 255, 0);스크롤을 내려보세요">
<div style="display: block; width: 410px; height:370px; background: none; border-radius: 5px; border: none; overflow-x:hidden; overflow-y:auto;">
<img src="https://upload2.inven.co.kr/upload/2015/02/18/bbs/i0245146858.jpg" border="0" style="width:370px; padding-bottom:10px;">
<img src="https://upload2.inven.co.kr/upload/2015/02/19/bbs/i0829502557.gif" border="0" style="width:370px; padding-bottom:10px;">
<img src="https://upload2.inven.co.kr/upload/2016/08/26/bbs/i11931702564.gif" border="0" style="width:370px; padding-bottom:10px;">
<img src="https://upload2.inven.co.kr/upload/2016/08/26/bbs/i11709955779.jpg" border="0" style="width:370px; padding-bottom:10px;">
<img src="https://upload2.inven.co.kr/upload/2016/08/26/bbs/i13782833530.jpg" border="0" style="width:370px; padding-bottom:10px;">
<img src="https://upload2.inven.co.kr/upload/2018/03/03/bbs/i14725833292.gif" border="0" style="width:370px; padding-bottom:10px;">
<img src="https://upload2.inven.co.kr/upload/2018/03/03/bbs/i14714764291.gif" border="0" style="width:370px; padding-bottom:10px;">
</div>
</div>
</div>
<!-- Tab5 내용 -->
<div data-inven-tab-id="Tab5" style="display: none;">
<div style="display: block; width: 370px; height:380px; background: rgba(255, 255, 255, 0.8); border-radius: 10px; border: 1px solid rgba(255,128,192, 1.0); overflow:hidden; padding:10px 10px 0px 10px;"data-inven-tooltip="rgba(255, 255, 255, 1);rgba(255,128,192,
0.9);rgba(255, 255, 255, 0);스크롤을 내려보세요">
<div style="display: block; width: 410px; height:370px; background: none; border-radius: 5px; border: none; overflow-x:hidden; overflow-y:auto;">
<img src="https://upload2.inven.co.kr/upload/2015/02/18/bbs/i1891491836.jpg" border="0" style="width:370px; padding-bottom:10px;">
<img src="https://upload2.inven.co.kr/upload/2015/02/18/bbs/i1897129136.jpg" border="0" style="width:370px; padding-bottom:10px;">
</div>
</div>
</div>
</div>
</div>
</div>
<div style="display:block; float:left; background: rgba(255,128,192, 0.2); width:450px; height:500px; position:relative; top:-500px; z-index:1;">
<!-- 눈 오는 배경 -->
<div data-inven-id="back_snow" align="left" style="display:block; float:left; position:relative; z-index:1; width:450px; height:500px; font-size:8px; color:white; background:rgba(0,0,0,0.0.0); opacity:0.7">
<div style="display:inline-block; float:left; width:500px; height:500px;"><marquee width="15px" height="500px" direction="down" scrollamount="26"> ●<br><br><br><br><br><br><br><br>●<br><br><br><br><br><br><br><br><br>● </marquee><marquee width="15px" height="500px"
direction="down" scrollamount="22"><br><br><br><br>●<br><br><br><br><br><br><br><br><br><br>●<br><br><br><br><br><br><br><br>● </marquee><marquee width="15px" height="500px" direction="down"
scrollamount="32"><br>●<br><br><br><br><br><br><br><br>●<br><br><br><br><br><br><br><br><br><br><br>● </marquee><marquee width="15px" height="500px" direction="down"
scrollamount="36"><br><br><br>●<br><br><br><br><br><br><br><br><br>●<br><br><br><br><br><br><br><br><br><br>● </marquee><marquee width="15px" height="500px" direction="down" scrollamount="28">
●<br><br><br><br><br><br><br><br>●<br><br><br><br><br><br><br><br><br><br>● </marquee><marquee width="15px" height="500px" direction="down" scrollamount="25"> ●<br><br><br><br><br><br><br><br>●<br><br><br><br><br><br><br><br><br>● </marquee><marquee width="15px"
height="500px" direction="down" scrollamount="30"><br><br><br><br>●<br><br><br><br><br><br><br><br><br><br>●<br><br><br><br><br><br><br><br>● </marquee><marquee width="15px" height="500px" direction="down"
scrollamount="33"><br>●<br><br><br><br><br><br><br><br>●<br><br><br><br><br><br><br><br><br><br><br>● </marquee><marquee width="15px" height="500px" direction="down"
scrollamount="27"><br><br><br>●<br><br><br><br><br><br><br><br><br>●<br><br><br><br><br><br><br><br><br><br>● </marquee><marquee width="15px" height="500px" direction="down" scrollamount="23">
●<br><br><br><br><br><br><br><br>●<br><br><br><br><br><br><br><br><br><br>● </marquee><marquee width="15px" height="500px" direction="down" scrollamount="20"> ●<br><br><br><br><br><br><br><br>●<br><br><br><br><br><br><br><br><br>● </marquee><marquee width="15px"
height="500px" direction="down" scrollamount="24"><br><br><br><br>●<br><br><br><br><br><br><br><br><br><br>●<br><br><br><br><br><br><br><br>● </marquee><marquee width="15px" height="500px" direction="down"
scrollamount="30"><br>●<br><br><br><br><br><br><br><br>●<br><br><br><br><br><br><br><br><br><br><br>● </marquee><marquee width="15px" height="500px" direction="down"
scrollamount="34"><br><br><br>●<br><br><br><br><br><br><br><br><br>●<br><br><br><br><br><br><br><br><br><br>● </marquee><marquee width="15px" height="500px" direction="down" scrollamount="26">
●<br><br><br><br><br><br><br><br>●<br><br><br><br><br><br><br><br><br><br>● </marquee><marquee width="15px" height="500px" direction="down" scrollamount="29"> ●<br><br><br><br><br><br><br><br>●<br><br><br><br><br><br><br><br><br>● </marquee><marquee width="15px"
height="500px" direction="down" scrollamount="25"><br><br><br><br>●<br><br><br><br><br><br><br><br><br><br>●<br><br><br><br><br><br><br><br>● </marquee><marquee width="15px" height="500px" direction="down"
scrollamount="21"><br>●<br><br><br><br><br><br><br><br>●<br><br><br><br><br><br><br><br><br><br><br>● </marquee><marquee width="15px" height="500px" direction="down"
scrollamount="35"><br><br><br>●<br><br><br><br><br><br><br><br><br>●<br><br><br><br><br><br><br><br><br><br>● </marquee><marquee width="15px" height="500px" direction="down" scrollamount="28">
●<br><br><br><br><br><br><br><br>●<br><br><br><br><br><br><br><br><br><br>● </marquee><marquee width="15px" height="500px" direction="down" scrollamount="31"> ●<br><br><br><br><br><br><br><br>●<br><br><br><br><br><br><br><br><br>● </marquee><marquee width="15px"
height="500px" direction="down" scrollamount="22"><br><br><br><br>●<br><br><br><br><br><br><br><br><br><br>●<br><br><br><br><br><br><br><br>● </marquee><marquee width="15px" height="500px" direction="down"
scrollamount="27"><br>●<br><br><br><br><br><br><br><br>●<br><br><br><br><br><br><br><br><br><br><br>● </marquee><marquee width="15px" height="500px" direction="down"
scrollamount="34"><br><br><br>●<br><br><br><br><br><br><br><br><br>●<br><br><br><br><br><br><br><br><br><br>● </marquee><marquee width="15px" height="500px" direction="down" scrollamount="31">
●<br><br><br><br><br><br><br><br>●<br><br><br><br><br><br><br><br><br><br>● </marquee><marquee width="15px" height="500px" direction="down" scrollamount="29"> ●<br><br><br><br><br><br><br><br>●<br><br><br><br><br><br><br><br><br>● </marquee><marquee width="15px"
height="500px" direction="down" scrollamount="23"><br><br><br><br>●<br><br><br><br><br><br><br><br><br><br>●<br><br><br><br><br><br><br><br>● </marquee><marquee width="15px" height="500px" direction="down"
scrollamount="32"><br>●<br><br><br><br><br><br><br><br>●<br><br><br><br><br><br><br><br><br><br><br>● </marquee><marquee width="15px" height="500px" direction="down"
scrollamount="36"><br><br><br>●<br><br><br><br><br><br><br><br><br>●<br><br><br><br><br><br><br><br><br><br>● </marquee><marquee width="15px" height="500px" direction="down" scrollamount="24">
●<br><br><br><br><br><br><br><br>●<br><br><br><br><br><br><br><br><br><br>● </marquee>
</div>
</div>
<!-- 눈 오는 배경 끝 -->
</div>
</div>