사이트 우측에 스크롤되는 배너 넣기 > 그누보드5 팁자료실

그누보드5 팁자료실

사이트 우측에 스크롤되는 배너 넣기 정보

사이트 우측에 스크롤되는 배너 넣기

본문

http://sir.co.kr/bbs/board.php?bo_table=g4_tiptech&wr_id=33605&page=2 님이 올려주신 그누보드4의 소스를 그누보드5로 수정해서 적용했는데 잘 작동이 되네요.

중앙정렬인지 좌측정렬인지 확인하셔서

좌측정렬일 경우는 left 값을 left:1000px; --> 좌측으로부터 떨어진 원하는 거리만큼 수정
중앙정렬일 경우는 left 값을 left:50%; margin-left:490px; --> 중앙에서 떨어진 거리만큼 수정(그누보드5의 기본 레이아웃인 경우 490px로 설정하니 적절하네요.)
 
위에서 부터의 거리는 top:200px; --> 위에서 부터 원하는 거리만큼 수정

이렇게 원하는 위치에 놓으시면 됩니다.

스크롤을 느리게 할 경우는 스크립트 소스에서 300이라는 숫자를 1000 정도로 올리시면 되고,  빠르게 할 경우는 100으로 줄이면 됩니다.

head.sub.php 소스에서
</head>태그 끝나기 전에
<script type="text/javascript">
 $(function () {
 var cssTop = parseInt($("#sky").css("top"));
  $(window).scroll(function () {
  var position = $(window).scrollTop();
  $("#sky").stop().animate({ "top": (position + cssTop) + "px" }, 300);
  });
});
</script>
코드를 붙여주시고요.

배너가 들어가기 원하는 곳에 아래와 같은 코드를 넣어주시면 됩니다.
저의 경우는 배너 이미지의 가로200px, 세로 200px 이미지를 사용했습니다.
이미지나 다른 컨텐츠를 삽입해주시고, 그 컨텐츠 크기에 맞게 div#sky의 가로(width), 세로(height) 크기를 변경해 주시면 됩니다.
사이트 전체에 스크롤 배너가 나타나게 할려면 head.sub.php 소스 마지막에 아래의 코드를 넣으면 되고,
상단(head)에 나타나기를 원하시면 head.php에서
<!-- 상단 시작 { -->
<div id="hd">
부부 바로 위에 넣으시면 되고요.
메인 페이지에 나나나기를 원하면 index.php 파일에 아래의 코드를 넣으시면 됩니다.

<div id="sky" style="position:absolute;z-index:100;top:200px;left:50%;margin-left:490px;width:200px; height:200px;border:1px solid gray;">
<a href="#"><img src="<?=G5_URL;?>/img/banner.gif"></a>
</div>

익스, 크롬, 파폭에서 모두 정상적으로 잘 동작하네요..!!!
추천
5

댓글 19개


<?php
if(!defined('_INDEX_')) { // index에서만 실행
?>
<script type="text/javascript"> 
 $(function () { 
 var cssTop = parseInt($("#sky").css("top")); 
  $(window).scroll(function () { 
  var position = $(window).scrollTop(); 
  $("#sky").stop().animate({ "top": (position + cssTop) + "px" }, 300); 
  }); 
}); 
</script> 
<?php
}
?>

이런식으로 넣으시면 인덱스 페이지에는 띄워지지 않을 겁니다.
port 님 친절한 답변 감사드립니다.
위와 같이 했는 인덱스에 여전히 노출되고..

한 가지 변화가 있다면 상하 스크롤 되던것이 인덱스 상단에
딱 고정되어 있는 것 입니다.

거듭 멍청한 질문 드려서 죄송합니다.ㅠㅠ
도와줍셔..
죄송하지만 제가 초보라 그러는데 친절하게 알려주셔서 소스 만드는건 성공했는데요 추가로 몇개 더 아래다가 만들고 싶은데 그건 어떻게 해야 하는건가요?
전체 2,426 |RSS
그누보드5 팁자료실 내용 검색

회원로그인

(주)에스아이알소프트 / 대표:홍석명 / (06211) 서울특별시 강남구 역삼동 707-34 한신인터밸리24 서관 1404호 / E-Mail: admin@sir.kr
사업자등록번호: 217-81-36347 / 통신판매업신고번호:2014-서울강남-02098호 / 개인정보보호책임자:김민섭(minsup@sir.kr)
© SIRSOFT