前端_页面回到顶部封装的js

// 调用js方法
$(function () {
(new GoTop()).init({
pageWidth :960,
nodeId :'go-top',
nodeWidth :50,
distanceToPage:20,
distanceToBottom :125,
hideRegionHeight :130,
text :''
});
});

GoTop = function() {

    this.config = {
        pageWidth            :960,        // 页面宽度
        nodeId                :'go-top',    // Go Top 节点的 ID
        nodeWidth            :50,        // Go Top 节点宽度
        distanceToBottom    :120,        // Go Top 节点上边到页面底部的距离
        distanceToPage        :20,        // Go Top 节点左边到页面右边的距离
        hideRegionHeight    :90,        // 隐藏节点区域的高度 (该区域从页面顶部开始)
        text                :''            // Go Top 的文本内容
    };

    this.cache = {
        topLinkThread        :null        // 显示 Go Top 节点的线程变量 (用于 IE6)
    }
};

GoTop.prototype = {

    init: function(config) {
        this.config = config || this.config;
        var _self = this;

        // 滚动屏幕, 修改节点位置和显示状态
        jQuery(window).scroll(function() {
            _self._scrollScreen({_self:_self});
        });

        // 改变屏幕尺寸, 修改节点位置
        jQuery(window).resize(function() {
            _self._resizeWindow({_self:_self});
        });

        // 在页面中插入节点
        _self._insertNode({_self:_self});
    },

    /**
     * 在页面中插入节点
     */
    _insertNode: function(args) {
        var _self = args._self;

        // 插入节点并绑定节点事件, 当节点被点击, 用 0.4 秒的时间滚动到页面顶部
        var topLink = jQuery('<a id="' + _self.config.nodeId + '" href="#">' + _self.config.text + '</a>');
        topLink.appendTo(jQuery('body'));
        if(jQuery.scrollTo) {
            topLink.click(function() {
                jQuery.scrollTo({top:0}, 400);
                return false;
            });
        }

        // 节点到屏幕右边的距离
        var right = _self._getDistanceToBottom({_self:_self});

        // IE6 (不支持 position:fixed) 的样式
        if(/MSIE 6/i.test(navigator.userAgent)) {
            topLink.css({
                'display': 'none',
                'position': 'absolute',
                'right': right + 'px'
            });

        // 其他浏览器的样式
        } else {
            topLink.css({
                'display': 'none',
                'position': 'fixed',
                'right': right + 'px',
                'top': (jQuery(window).height() - _self.config.distanceToBottom) + 'px'
            });
        }
    },

    /**
     * 修改节点位置和显示状态
     */
    _scrollScreen: function(args) {
        var _self = args._self;

        // 当节点进入隐藏区域, 隐藏节点
        var topLink = jQuery('#' + _self.config.nodeId);
        if(jQuery(document).scrollTop() <= _self.config.hideRegionHeight) {
            clearTimeout(_self.cache.topLinkThread);
            topLink.hide();
            return;
        }

        // 在隐藏区域之外, IE6 中修改节点在页面中的位置, 并显示节点
        if(/MSIE 6/i.test(navigator.userAgent)) {
            clearTimeout(_self.cache.topLinkThread);
            topLink.hide();

            _self.cache.topLinkThread = setTimeout(function() {
                var top = jQuery(document).scrollTop() + jQuery(window).height() - _self.config.distanceToBottom;
                topLink.css({'top': top + 'px'}).fadeIn();
            }, 400);

        // 在隐藏区域之外, 其他浏览器显示节点
        } else {
            topLink.fadeIn();
        }
    },

    /**
     * 修改节点位置
     */
    _resizeWindow: function(args) {
        var _self = args._self;

        var topLink = jQuery('#' + _self.config.nodeId);

        // 节点到屏幕右边的距离
        var right = _self._getDistanceToBottom({_self:_self});

        // 节点到屏幕顶部的距离
        var top = jQuery(window).height() - _self.config.distanceToBottom;
        // IE6 中使用到页面顶部的距离取代
        if(/MSIE 6/i.test(navigator.userAgent)) {
            top += jQuery(document).scrollTop();
        }

        // 重定义节点位置
        topLink.css({
            'right': right + 'px',
            'top': top + 'px'
        });
    },

    /**
     * 获取节点到屏幕右边的距离
     */
    _getDistanceToBottom: function(args) {
        var _self = args._self;

        // 节点到屏幕右边的距离 = (屏幕宽度 - 页面宽度 + 1 "此处 1px 用于消除偏移" ) / 2 - 节点宽度 - 节点左边到页面右边的宽度 (20px), 如果到右边距离屏幕边界不小于 10px
        var right = parseInt((jQuery(window).width() - _self.config.pageWidth + 1)/2 - _self.config.nodeWidth - _self.config.distanceToPage, 10);
        if(right < 10) {
            right = 10;
        }

        return right;
    }
};