滚动条相关1

1.页面文档滚动条 获取和判断

            //1.获取浏览器可视区域的高度
            $(window).resize(function () {
                //使用js
                //var clientHeight = scrollHelper.getClientHeight();

                //使用 jquery
                var clientHeight = $(window).height();

                $(".divFixed").text(clientHeight);
            });

            //2.获取浏览器文档的高度
            $(window).resize(function () {
                //使用js
                //var docHeight = scrollHelper.getScrollHeight();

                //使用jQuery
                var docHeight = $(document).height();

                $(".divFixed").text(docHeight);
            });

            //3.判断当前 滚动条是否 最高，或最低
            $(window).scroll(function () {
                //1.获取当前滚动条位置
                var scrollTop = $(window).scrollTop();
                var difference = $(document).height() - $(window).height();

                if (scrollTop == 0) {
                    $(".divFixed").text("滚动条到了顶端");
                }
                else if (scrollTop == difference) {
                    $(".divFixed").text("滚动条到了底端");
                } else {
                    $(".divFixed").text(scrollTop);
                }
            });

            //4.jquery 动画滚动到 浏览器 顶端
            $('.divFixed').click(function () {
                $('body,html').stop(true, false).animate({ scrollTop: 0 }, 1500);
            });

            //5.jquery 动画滚动套 浏览器 底端
            $('.divFixed').click(function () {
                var difference = $(document).height() - $(window).height();
                $('body,html').stop(true, false).animate({ scrollTop: difference }, 1500);
            });

2.Div滚动条 获取和判断

            var divOne = $('.divOne');
            var divTwo = $('.divTwo');
            //1.获取div的滚动条的
            $(".divTwo").scroll(function (e) {
                var scrollTop = divTwo.scrollTop();

                ////2.获取div的 内容的高度（目前不可用）
                //var scrollHeight = divTwo.innerHeight();

                divOne.text(scrollTop);
            });
            //2.判断滚动条 是否到了底部
            var scrollHeight = 0;//滚动条距离总长
            var scrollTop = 0;//当前滚动条位置
            $(".divTwo").scroll(function () {
                var height = $(this).height();

                scrollHeight = $(this)[0].scrollHeight;
                scrollTop = $(this).scrollTop();

                if (scrollTop + height >= scrollHeight) {
                    divOne.text("滚到底部了");
                }
                else if (scrollTop == 0) {
                    divOne.text("到顶端了");
                }
            });