오른쪽우측에 스크롤되는 배너 > 라이브러리

갤러리노마드 홈페이지에 오신것을 환영합니다

오른쪽우측에 스크롤되는 배너

페이지 정보

profile_image
작성자 갤러리노마드
댓글 0건 조회 1,062회 작성일 18-09-04 05:04

본문

좌측정렬일 경우는 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> 

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

댓글목록

등록된 댓글이 없습니다.