menu

어떤 원리냐면, 게시물 높이 계산한 다음에 반복문 돌려서 게시물 가운데랑 가장 근접한 요소를 찾는 거임. 그 다음 거기에 광고 끼워넣음.

몇 가지 예외가 있는데, 일단 짧은 글에는 중간에 광고 안 나옴. 왜냐? 내용보다 광고가 자리를 더 많이 차지하면 모양새 빠지니까. 그리고 다른 예외로 글 중 table 태그가 있을 경우 표 중간에 광고 나오게 함. 이유는 요즘 싸질러놓은 게시물 중에 표 들어간게 많아서.

그리고 원래는 스킨에 애드센스 코드 넣어둔 다음에 jQuery의 after나 prepend 같은 메소드로 자리만 샤샤샥 옮기려고 했었는데, 그리하면 광고가 빈칸으로 출력... 아마 html 복제 후 원본을 삭제하는 메커니즘인 것 같은데, 그 순간에 페이지 허용 광고 개수 초과해서 빈칸이 나오는 게 아닐까? 어쩔 수 없이 스크립트 내에 애드센스 코드를 삽입해서 한번만 불러오도록 했다.

완성된 코드의 늠름한 자태를 아래에서 감상하시라!

function ad_article_middle() { //on test! var AD_CODE = '<div class="ad_article_middle">'+ 'ADSENS CODE HERE!'+ '</div>'; if ($('.article').height() >= 2000 && $('.article').children().length >= 20) { for (i = 1; i <= $('.article').children().length; i++) { if ($('.article > *:nth-child(' + i + ')').offset().top - $('.article').offset().top > $('.article').height() / 2) { if ($('.article > *')[i - 2].tagName !== "TABLE") { $('.article > *:nth-child(' + i + ')').after(AD_CODE); // console.log("normal, i=" + i + ", " + $('.article > *')[i - 1].tagName); } else { for (j = 1; j <= $('.article > *:nth-child(' + (i - 1) + ') tr').length; j++) { if ($('.article > *:nth-child(' + (i - 1) + ') tr:nth-child(' + j + ')').offset().top - $('.article').offset().top > $('.article').height() / 2) { $('.article > *:nth-child(' + (i - 1) + ') tr:nth-child(' + j + ')') .after('<tr><td colspan="' + $('.article > *:nth-child(' + (i - 1) + ') tr:nth-child(' + j + ') > td').length + '">' + AD_CODE + '</td></tr>'); break; } } // console.log("table!, i=" + i + ", " + $('.article > *:nth-child(' + (i - 1) + ') tr').length); } break; } } } else { // console.log("no middle ad"); } }

흠 좀 멋지긴 한데, 이딴 쓸데없는 기능을 자꾸 추가해서 점점 로딩이 길어지는 것 같기도...

끝.

퍼가지 말고, 링크로 공유하세요. 자세한 건 공지에.

퍼가지 마세요...
링크로 공유하세요 ㅠㅠ
부탁할게요 ^_<~*

test 3-1

test 3-2

test 3-3

test 4-1

test 4-2

test 4-3

모든 글 보기
공지
방명록
Share to...

페이스북 공유

트위터 공유

구글+ 공유

카카오스토리 공유

밴드 공유

Follow & Contact

Facebook

Twitter

Mail

RSS 구독

2007-2016 © JinH