(새 문서: /* 이 스크립트는 Minecraft Wiki의 Majr의 goToTop.js를 (http://minecraftwiki.net/wiki/User:Majr/goToTop.js/) 리브레 위키의 사용자 Utolee90이 재가공해서 만들...) |
잔글 (Rainy 사용자가 사용자:Rainy/common.js 문서를 사용자:Rainy/liberty.js 문서로 옮겼습니다) |
||
(같은 사용자의 중간 판 3개는 보이지 않습니다) | |||
2번째 줄: | 2번째 줄: | ||
이 스크립트는 Minecraft Wiki의 Majr의 goToTop.js를 | 이 스크립트는 Minecraft Wiki의 Majr의 goToTop.js를 | ||
(http://minecraftwiki.net/wiki/User:Majr/goToTop.js/) | (http://minecraftwiki.net/wiki/User:Majr/goToTop.js/) | ||
리브레 위키의 사용자 Utolee90이 재가공해서 | 리브레 위키의 사용자 Utolee90이 재가공해서 만든 것을 다시 아주 약간 손봤습니다.*/ | ||
/* 위로 올라가는 버튼을 만듭니다. */ | /* 위로 올라가는 버튼을 만듭니다. */ | ||
$( function() { | $( function() { | ||
'use strict'; | 'use strict'; | ||
$( 'body' ).append( '<span id="to-top" style="font-size: | $( 'body' ).append( '<span id="to-top" style="font-size:24pt; color:#FFFFFF; background-color:#0077FF;">▲</span>' ); | ||
var $topButton = $( '#to-top' ); | var $topButton = $( '#to-top' ); | ||
16번째 줄: | 14번째 줄: | ||
'position': 'fixed', | 'position': 'fixed', | ||
'bottom': '-30px', | 'bottom': '-30px', | ||
' | 'right': '48px', | ||
'cursor': 'pointer', | 'cursor': 'pointer', | ||
'transition': 'bottom 0.5s', | 'transition': 'bottom 0.5s', | ||
40번째 줄: | 38번째 줄: | ||
'use strict'; | 'use strict'; | ||
$( 'body' ).append( '<span id="to-bottom" style="font-size: | $( 'body' ).append( '<span id="to-bottom" style="font-size:24pt; color:#FFFFFF; background-color:#0077FF;" >▼</span>' ); | ||
var $bottomButton = $( '#to-bottom' ); | var $bottomButton = $( '#to-bottom' ); | ||
var height=document.body.scrollHeight; | var height=document.body.scrollHeight; | ||
48번째 줄: | 46번째 줄: | ||
'position': 'fixed', | 'position': 'fixed', | ||
'bottom': '-30px', | 'bottom': '-30px', | ||
' | 'right': '10pt', | ||
'cursor': 'pointer', | 'cursor': 'pointer', | ||
'transition': 'bottom 0.5s', | 'transition': 'bottom 0.5s', |
2016년 5월 6일 (금) 23:58 기준 최신판
/*
이 스크립트는 Minecraft Wiki의 Majr의 goToTop.js를
(http://minecraftwiki.net/wiki/User:Majr/goToTop.js/)
리브레 위키의 사용자 Utolee90이 재가공해서 만든 것을 다시 아주 약간 손봤습니다.*/
/* 위로 올라가는 버튼을 만듭니다. */
$( function() {
'use strict';
$( 'body' ).append( '<span id="to-top" style="font-size:24pt; color:#FFFFFF; background-color:#0077FF;">▲</span>' );
var $topButton = $( '#to-top' );
$topButton.css( {
'color': '#FFF',
'position': 'fixed',
'bottom': '-30px',
'right': '48px',
'cursor': 'pointer',
'transition': 'bottom 0.5s',
'-webkit-transition': 'bottom 0.5s',
'user-select': 'none',
'-webkit-user-select': 'none',
'-moz-user-select': 'none',
'-ms-user-select': 'none'
} ).click( function() {
$( 'html, body' ).animate( { scrollTop: 0 }, 'slow' );
} );
/* 위에서 100픽셀 이내에 있으면 위 버튼을 숨깁니다. */
$( window ).scroll( function() {
if ( $( window ).scrollTop() > 100 ) {
$topButton.css( 'bottom', '4px' );
} else {
$topButton.css( 'bottom', '-30px' );
}
} );
} );
/* 아래 버튼을 만듭니다. */
$( function() {
'use strict';
$( 'body' ).append( '<span id="to-bottom" style="font-size:24pt; color:#FFFFFF; background-color:#0077FF;" >▼</span>' );
var $bottomButton = $( '#to-bottom' );
var height=document.body.scrollHeight;
var hminus=document.body.scrollHeight-"100";
$bottomButton.css( {
'color': '#FFF',
'position': 'fixed',
'bottom': '-30px',
'right': '10pt',
'cursor': 'pointer',
'transition': 'bottom 0.5s',
'-webkit-transition': 'bottom 0.5s',
'user-select': 'none',
'-webkit-user-select': 'none',
'-moz-user-select': 'none',
'-ms-user-select': 'none'
} ).click( function() {
$( 'html, body' ).animate( { scrollTop:height}, 'slow' );
} );
/*아래에서 100픽셀 이내이면 아래 버튼을 숨깁니다. */
$( window ).scroll( function() {
if ( $( window ).scrollTop () <hminus ) {
$bottomButton.css( 'bottom', '4px' );
} else {
$bottomButton.css( 'bottom', '-30px' );
}
} );
} );