https://ztema.ru/assets/js/jquery.itoppage.js

1/*
2 * Name:		iTopPage
3 * Title:		Imageless "Top of the page" plugin for jQuery
4 * Version:		1.2.2
5 * Author:		Bubori Attila
6 * License:		GPLv2 (http://www.gnu.org/licenses/gpl-2.0.html)
7 * Contact:		[email protected]
8 * Country:		Hungary
9 * Released:	2013.01.21
10 * Description:	Showing a colored gradient box with a white arrow from a specified point,
11 * 				when user scrolling down to the bottom of the page.
12 * 				Parameters:
13 * 					startPosition: 100  	//Position from top of the window (in pixels)
14 * 					title: 'Scroll to Top'	//Mouse hover title attribute text
15 * 					color: 'red'			//black(default),red,pink,blue,orange,green
16 * 					place: 'bottomRight'	//Position of the button: bottomLeft, bottomCenter, bottomRight(default)
17 * 					picture: 'toparrow.png'	//Relative or absolute path of an image (jpg,png,gif,jpeg) default: null (imageless mode)
18 * 
19 * 				Must be use the jquery.itoppage.css file to format the button!
20 * 
21 * Usage:		$(document).ready(function() {
22 * 					$().iTopPage();
23 * 				});
24 * 				
25 *				//or with parameters
26 *				
27 * 				$(document).ready(function() {
28 * 					$().iTopPage({startPosition: 100, title: "Oldal tetejére"});
29 * 				});
30 */
31
32(function($) {      
33    $.fn.extend({ 
34	
35        iTopPage: function(options) {
36  			      	
37        	var defaults = {
38				startPosition: 100,
39				title: 'Вверх',
40				color: 'black',
41				place: 'bottomRight',
42				picture: null
43			};
44        	
45        	var options = $.extend({}, defaults, options);
46        	
47        	if (options.picture == null) {
48        		$("body").append("<div id='iTopPage' class='iTopPage' title='" + options.title + "'><p id='arrow'>&#9650;</p></div>");
49          	} else {
50          		$("body").append("<div id='iTopPage' title='" + options.title + "'><image src='" + options.picture + "'></div>");
51          	}
52            var $iTopPage = $("#iTopPage");
53            var leftPoisition;
54            
55            $iTopPage.addClass(options.color)
56            
57            function leftPositionCalculate() {
58            	switch (options.place) {
59            		case 'bottomRight' :
60            			leftPosition = $(window).width() - $iTopPage.height() - 30 + "px";
61            			break;
62            		case 'bottomCenter' :
63            			leftPosition = $(window).width()/2 - $iTopPage.height()/2 + "px";
64            			break;
65            		case 'bottomLeft' :
66            			leftPosition = "30px";
67            			break;
68            	}
69            return leftPosition;
70            }
71            
72            $iTopPage.css({
73            	"top": $(window).height() - $iTopPage.height() - 30 + "px",
74            	"left" : leftPositionCalculate(),
75       			"opacity" : $(window).scrollTop() > options.startPosition && $iTopPage.css("opacity") == "0" ? "1" : $(window).scrollTop() < options.startPosition ? "0" : "1",
76       			"display" : $(window).scrollTop() > options.startPosition && $iTopPage.css("display") == "none" ? "block" : $(window).scrollTop() < options.startPosition ? "none" : "table-cell"
77            }); 
78                        
79            $(window).scroll(function() {
80            		$iTopPage.css({
81            			"top": $(window).height() - $iTopPage.height() - 30 + "px",
82            			"display" : $(window).scrollTop() > options.startPosition && $iTopPage.css("display") == "none" ? "block" : $(window).scrollTop() < options.startPosition ? "none" : "table-cell"
83            		});
84            		
85            		$iTopPage.stop().animate({
86            			"opacity" : $(window).scrollTop() > options.startPosition && $iTopPage.css("opacity") == "0" ? "1" : $(window).scrollTop() < options.startPosition ? "0" : "1"
87           			}, 300);
88            });
89            
90            $(window).resize(function() {
91            		$iTopPage.css({
92            			"top": $(window).height() - $("#iTopPage").height() - 30 + "px",
93            			"left" : leftPositionCalculate()
94            		});
95            });
96            
97            $iTopPage.on("click", function() {
98            	$('html, body').animate({ scrollTop: 0 }, 'fast');
99            });
100            
101            return this;    
102        }      
103    });  
104})(jQuery);