맛집 여행 캠핑 일상 생활

블로그스팟 스크롤 되더라도 항상 보이는 가젯 만들기 본문

블로그

블로그스팟 스크롤 되더라도 항상 보이는 가젯 만들기

영은파더♥ 2016. 3. 24. 14:03

구글블로그 페이지가 스크롤 되어 화면이 아래쪽으로 움직여도 항상 특정(애드센스 같은)

사이드바 메뉴가 보이고 싶을 때 아래와 같은 가젯을 만들어 주면 된다.


설정 -> 레이아웃 -> 가젯추가 -> 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>


가젯을 하단에 위치 시키지 않으면 겹칠 수가 있기 때문에 항상 주의하여야 한다.


Trackback : | Comments :