0
조회 수 : 6808 신고 : 0
미리보기 : |
---|
여러가지로 응용할수 있겠지만, top버튼을 클릭시 상단으로 부드럽게 이동되는 효과입니다.
먼저 웹문서 페이지 head와 head사이에 jquery 를 호출합니다. 여러곳에서 제공도 해주고, 직접다운받아서 호출해도 됩니다.
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js "></script>
<script type="text/javascript" src="jquery.slideto.min.js"></script>
위에 jquery.slideto.min.js 파일은 첨부파일을 확인해주세요. 압축을 풀고 해당 js 문서를 호출하시면됩니다.
마찬가지로 head와 head사이에 아래소스를 삽입합니다.
<script type="text/javascript">
jQuery(function($){
$("#body_top").click(function(){
$("#header").slideto({highlight: false});
});
});
</script>
여기에서 #body_top 은 top버튼에 id값입니다.
ex) <a href="#none" id="body_top">위로가기</a>
#header 은 '위로가기'를 클릭했을때 이동되는 id값입니다.
#body_top과 #header 은 정해진값이 아니니 사이트에 맞게 수정해주세요.
<div id="header"></div>
상단이 위처럼 header 로 감쌌다면 저값을 넣어주시면 됩니다.
꼭 top버튼이 아니더라도 여러 형태로 응용해보세요.
추천수 10단위당 메달이 1개씩 노출되고, 추천수에 따라 배경색이 변하며, 일정수의 추천수를 받을시 아이콘이 붙게됩니다.
- 추천수 50개이상
- 추천수 30개이상
- 추천수 20개이상
- 추천수 10개이상
- 추천수 3개이상