jquery 上下滚动显示隐藏

 

    function scroll(fn) {
        var beforeScrollTop = document.body.scrollTop,
            fn = fn || function() {};
        window.addEventListener("ontouchmove", function() {
            var afterScrollTop = document.body.scrollTop,
                delta = afterScrollTop - beforeScrollTop;
            if (delta === 0) return false;
            fn(delta > 0 ? "down" : "up");
            beforeScrollTop = afterScrollTop;
        }, false);
    }

 

2，sass转译

@function rem($n) {
        @return $n / 40 + rem;
}

 

3，js判断鼠标上下滚动；

<script type="text/javascript">  
        var scrollFunc = function (e) {  
       　　 e = e || window.event;  
        　　if (e.wheelDelta) {  //判断浏览器IE，谷歌滑轮事件               
         　　   if (e.wheelDelta > 0) { //当滑轮向上滚动时  
             　　   alert("滑轮向上滚动");  
           　　 }  
           　　 if (e.wheelDelta < 0) { //当滑轮向下滚动时  
              　　  alert("滑轮向下滚动");  
           　　 }  
      　　  } else if (e.detail) {  //Firefox滑轮事件  
           　　 if (e.detail> 0) { //当滑轮向上滚动时  
              　　  alert("滑轮向上滚动");  
           　　 }  
           　　 if (e.detail< 0) { //当滑轮向下滚动时  
               　　 alert("滑轮向下滚动");  
            　　}  
       　　 }  
   　　 }  
    　　　//给页面绑定滑轮滚动事件  
    　　if (document.addEventListener) {//firefox  
        　　document.addEventListener('DOMMouseScroll', scrollFunc, false);  
    　　}  
    　　//滚动滑轮触发scrollFunc方法  //ie 谷歌  
    　　window.onmousewheel = document.onmousewheel = scrollFunc;   
    </script> 

 

4，判断鼠标、滚动条上下滚动

            var windowTop = 0;
            $(window).scroll(function() {
                var scrolls = $(this).scrollTop();
                if(scrolls < 5 || scrolls <= windowTop) {
                    // 向上滚动显示
                    console.log('向上')
                    windowTop = scrolls;
                } else {
                    // 向下滚动隐藏
                    console.log('向下')
                    windowTop = scrolls;
                }
            });

 

5，设置页面加载时滚动条自动滚到底的方法：

  window.onload = function(){
  	var h = document.documentElement.scrollHeight || document.body.scrollHeight;
  	window.scrollTo(h,h);
  }

$(function(){
      var h = $(document).height()-$(window).height();
      $(document).scrollTop(h);
});

 

6，可以将HTML结构转换成字符串的函数；

            
            function Dom2Str(fn) {
                return fn.toString().replace(/^[^\/]+\/\*!?\s?/, '').replace(/\*\/[^\/]+$/, '').trim().replace(/>\s*</g, '><');
            }
            
            var str = Dom2Str(function(){
                /*
                     <a class="tab-item active" href="#">
                        <span class="icon icon-home"></span>
                        <span class="tab-label">首页</span>
                    </a>
                    <a class="tab-item" href="#">
                        <span class="icon icon-me"></span>
                        <span class="tab-label">我</span>
                    </a>
                    <a class="tab-item" href="#">
                        <span class="icon icon-star"></span>
                        <span class="tab-label">收藏</span>
                    </a>
                    <a class="tab-item" href="#">
                        <span class="icon icon-settings"></span>
                        <span class="tab-label">设置</span>
                    </a>
                */
            });
            
            $('nav').append(str);

 

 

 

。