애드센스와 애드핏에서 플로팅 배너 광고를 허용하고 있다. 이번 내용은 플로팅 배너를 간단하게 장착하는 방법과 필요한 각종 링크들이다.
■ 따라다니는 효과가 필요없다면!
아래 내용을 그대로 삽입하면 된다.
<style>
#banner {
position: fixed; /*고정*/
width: 162px; /*가로길이*/
height: 835px; /*세로길이*/
right: 2px; /*위치 지정 : 오른쪽에서 몇 px에 위치, 왼쪽 배너이면 left : 2px; */
top: 48px; /* 위치 지정 : 상단에서 몇 px에 위치, 하단부터라면 bottom:48px; */
text-align:center; /*중앙정렬*/
}
</style>
<div id=”banner”> 여기에 내용 삽입(혹은 광고 삽입)</div>
★ 본문을 침범하면 안된다면…
(아래 링크를 참고해도 CSS는 본 내용을 적절히 참고해야 한다.)
<style>
#banner {
position: fixed;
right:50%; // 기본은 중앙에 위치하고.
margin-right:-615px; // 중앙으로부터의 거리를 주는 방식으로 보인다.
width: 162px;
height: 835px;
top: 68px;
}
</style>
<div id=”banner”> 여기에 내용 삽입(혹은 광고 삽입)</div>
★ 본문을 가리지 않는 고정형 플로팅 배너 소스 : [마쑤의 작은방에서 보기]
■ 따라다니는 효과가 필요하다면!
아래 링크를 참고하면 된다. jQuery를 사용한, 아주 좋은 예이다.
★ 플로팅 배너, 자동으로 따라다니는 jQuery 소스 : [천재 작곡가의 작업실에서 보기]
■ 자바스크립트를 통해 모바일 여부를 확인하려면!
아래 링크를 참고하면 된다.
★ 접속 환경(PC or Mobile)을 구분해주는 자바스크립트 함수 : [바로 보기]
■ PHP를 통해 모바일 여부를 확인하려면!
★ 접속 환경(PC or Mobile)을 구분해주는 PHP 함수 : [바로 보기]
1일 1포스팅을 달성하기 위해 간략히 작성해보았다. Good!