땀똔의 프로필 사진

티스토리, 이미지에 번호 붙이기..

    Information/For Tistory

 

   

 

사진이 많을 때, 이미지에 연속 번호 매기기..

 

 

 

[Demo] 티스토리, 이미지에 번호 붙이기

 

dd-stuff.tistory.com

 

 

/* Javascript */

// 사용자설정

// C - 캡션 자리에 삽입 || P - 이미지 아래에 P 태그로 삽입 || L - 이미지 위에 띄우는 레이어
let wopt = "L"

// 1 - 사진이 X장 이상이면 적용 || 2 - <div class="bigImg"></div> 태그로 감싼 사진만 적용
let aopt = 1;

// aopt 값이 1일 때의, 사진 매수 지정
let icnt = 10;

const _0x3d1b86=_0x2ce1;function _0x229e(){const _0x4f7183=['tt-body-page','</span></figcaption>','430913mdOBaK','<figcaption\x20class=\x22bigImgNum\x22><span>','querySelectorAll','10pFBluK','div.bigImg\x20.imageblock','body','forEach','14795561GpLYxa','querySelector','.imageblock','insertAdjacentHTML','length','59QwfZzL','<p\x20class=\x22bigImgNum\x22><span>','beforeend','4908WdzBTQ','8exLRfM','</span></p>','4196964AcWWCB','22394xdbOIf','6956730rwJiWY','3909PeTosb','6721690pwfChc'];_0x229e=function(){return _0x4f7183;};return _0x229e();}function _0x2ce1(_0x13dd46,_0x3bee6f){const _0x229e8a=_0x229e();return _0x2ce1=function(_0x2ce128,_0x4f6ed){_0x2ce128=_0x2ce128-0xed;let _0x34f8b6=_0x229e8a[_0x2ce128];return _0x34f8b6;},_0x2ce1(_0x13dd46,_0x3bee6f);}(function(_0x3a5259,_0x35dd46){const _0xfb251c=_0x2ce1,_0x232057=_0x3a5259();while(!![]){try{const _0x1e5dd1=parseInt(_0xfb251c(0xf9))/0x1*(parseInt(_0xfb251c(0x100))/0x2)+parseInt(_0xfb251c(0x102))/0x3*(parseInt(_0xfb251c(0xfc))/0x4)+parseInt(_0xfb251c(0xf0))/0x5*(parseInt(_0xfb251c(0xff))/0x6)+-parseInt(_0xfb251c(0xed))/0x7*(parseInt(_0xfb251c(0xfd))/0x8)+-parseInt(_0xfb251c(0x101))/0x9+-parseInt(_0xfb251c(0x103))/0xa+-parseInt(_0xfb251c(0xf4))/0xb;if(_0x1e5dd1===_0x35dd46)break;else _0x232057['push'](_0x232057['shift']());}catch(_0x1089d1){_0x232057['push'](_0x232057['shift']());}}}(_0x229e,0xc4ef3));if(document[_0x3d1b86(0xf5)](_0x3d1b86(0xf2))['id']==_0x3d1b86(0x104)){let query;if(aopt==0x1&&icnt<=document['querySelectorAll'](_0x3d1b86(0xf6))[_0x3d1b86(0xf8)])query='.imageblock';else aopt==0x2&&(query=_0x3d1b86(0xf1));document[_0x3d1b86(0xef)](query)[_0x3d1b86(0xf3)](function(_0x5af05c,_0x179a5d){const _0x54d64e=_0x3d1b86;var _0xdce88f=_0x179a5d+0x1;if(wopt=='C')_0x5af05c[_0x54d64e(0xf7)](_0x54d64e(0xfb),_0x54d64e(0xee)+_0xdce88f+_0x54d64e(0x105));else{if(wopt=='P')_0x5af05c[_0x54d64e(0xf7)](_0x54d64e(0xfb),_0x54d64e(0xfa)+_0xdce88f+_0x54d64e(0xfe));else wopt=='L'&&_0x5af05c[_0x54d64e(0xf7)](_0x54d64e(0xfb),'<div\x20class=\x22bigImgNum\x22><span>'+_0xdce88f+'</span></div>');}});}

 

 

/* CSS */

/* 숫자 앞에 특수문자 붙이기 */
.bigImgNum span:before { content:"\2116"; padding-right:3px; font-size:18px; /*text-shadow:1px 1px 1px rgba(0,0,0,.7)*/ }

/* P 태그일 때 */
p.bigImgNum { text-align:center; font-size:18px }

/* 캡션일 때 */
figcaption.bigImgNum { text-align:center; font-size:18px }

/* 레이어일 때 */
div.bigImgNum { position:absolute; width:70px; height:50px; top:10px; right:-4px; background:transparent }
div.bigImgNum span { color:#fff; opacity:.8; font-size:18px; text-shadow:1px 1px 1px rgba(0,0,0,.7) }