일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | 3 | 4 | 5 | 6 | 7 |
8 | 9 | 10 | 11 | 12 | 13 | 14 |
15 | 16 | 17 | 18 | 19 | 20 | 21 |
22 | 23 | 24 | 25 | 26 | 27 | 28 |
29 | 30 | 31 |
- 복현오거리
- mysql
- 윈도우10
- OpenWrt
- 라즈베리파이2
- 스톤에이지
- 알뜰폰
- KB증권
- 시놀로지
- jQuery
- Apache
- 가상서버호스팅
- 아파치
- 티스토리
- ConoHa
- KB국민카드
- php
- PHP-FPM
- SKT
- Rocky
- 보르비스초월
- 킹북이초월
- centos
- 자바스크립트
- 리눅스
- 램가스초월
- 알리익스프레스
- iptime
- proxmox
- 소비전력
- Today
- Total
맛집 여행 캠핑 일상 생활
블로그스팟 스크롤 되더라도 항상 보이는 가젯 만들기 본문
구글블로그 페이지가 스크롤 되어 화면이 아래쪽으로 움직여도 항상 특정(애드센스 같은)
사이드바 메뉴가 보이고 싶을 때 아래와 같은 가젯을 만들어 주면 된다.
설정 -> 레이아웃 -> 가젯추가 -> HTML/JavaScript 를 클릭해서 제목을 적고 내용에 아래 소스코드를 넣어주고 저장하면 된다.
그리고 사이드바에서 제일 하단에 가젯을 위치시키면 된다.
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<script>
$(document).ready(function(){
var oLeft = $('#fixedLayer').offset().left;
var oTop = -1;
$(window).scroll(function(){
if($(document).scrollTop() > $('#_fixedLayer').offset().top) {
if(oTop == -1) {
oTop = $(document).scrollTop() - $('#_fixedLayer').offset().top;
$('#fixedLayer').css({ position:'fixed',left:oLeft,top:oTop });
}
}
else {
if(oTop != -1) {
oTop = -1;
$('#fixedLayer').css({ position:'static' });
}
}
});
});
</script>
<div id="_fixedLayer" style="width:200px;height:0px;overflow:hidden;"></div>
<div id="fixedLayer" style="width:200px;height:auto;">
<b>항상 보이는 레이어</b>
<br/>
여기에 내용을 넣으면 됩니다.
</div>
가젯을 하단에 위치 시키지 않으면 겹칠 수가 있기 때문에 항상 주의하여야 한다.
'블로그' 카테고리의 다른 글
페이스북 그룹 알림 안받게 설정하는 방법 (0) | 2016.06.17 |
---|---|
바이두 웹마스터도구에 사이트등록 효과 (0) | 2016.05.04 |
이글루스 블로그 네이버웹마스터도구에 사이트등록하기 (4) | 2016.03.22 |
네이버 애널리틱스 사이트 등록하기 (0) | 2016.03.19 |
이글루스에 구글 웹로그 위젯 달기 (0) | 2016.03.19 |