zoukankan      html  css  js  c++  java
  • jquery插件回到顶部的功能

    /*
    * name: jquery.goTop.js
    *
    * Copyright (c) 2011
    * $author: PoulXia$
    * $Date: 2011-12-30$
    * $Contact: xbh520@gmail.com$
    */

    /**
    * 一个基于jQuery的回到顶部功能的插件
    * 调用示例1:
    * $(document).ready(function () {
    *     $.goTop({ renderTo: "middle2"});
    * });
    * 调用示例2:
    * $(document).ready(function () {
    *     $.goTop({renderTo:"divTop","top":"400px","right":"50px"});
    * });
    */
    ; (function ($) {
        $.extend(
        {
            goTop: function (config) {
                //默认配置
                var goTopConfig ={"top":"350px","right":"50px"};

                for(var key in config){
                    var val = config[key];
                    if(val){
                        goTopConfig[key] = val;
                    }
                }
                function checkScrollbar(el) {
                    var top = $(document).scrollTop();
                    if (top) {
                        el.show();
                    } else {
                        el.hide();
                    }
                }

                var el = $("#"+goTopConfig.renderTo);
                if(el.length < 1){
                    alert("调用出错,请参考调用示例!");
                    return false;
                }
                //默认样式
                el.css("position","fixed").css("top",goTopConfig.top).css("right",goTopConfig.right);

                //事件
                el.click(function () {
                    $(document).scrollTop(0);
                });

                //检测是否显示
                checkScrollbar(el);

                $(window).scroll(function () {
                    checkScrollbar(el);
                });
            }
        })
    })(jQuery);
    插件下载
  • 相关阅读:
    Bandicam班迪录屏 高清录制视频软件
    理解WebKit和Chromium: 浏览器综述
    GDAL对于raw数据支持的一个bug
    关于GDAL计算图像坐标的几个问题
    理解WebKit和Chromium: WebKit资源加载机制
    关于web服务器架构的思考
    使用PROJ4库将地心直角坐标(XYZ)转为地心大地坐标(BLH)
    Java数据类型和MySql数据类型对应表
    理解WebKit和Chromium: 基于Chromium内核的Android WebView
    【Unity探究】物理碰撞实验
  • 原文地址:https://www.cnblogs.com/Komici/p/2307702.html
Copyright © 2011-2022 走看看