博客网对应的js文件

点击“侧栏菜单”显示遮罩、右侧栏，再点击遮罩则隐藏侧栏菜单。

点击菜单项目，被点项目显示下面显示白色横条，其它项目取消横条。

$(function () {
  // 侧栏出现和消失
    'use strict';
     var silder = $('#silder'),
         mask = $('.mask'),
     silder_bar = $('#silder_bar');

    function showSilder() {
        // console.log(666)
        mask.fadeIn(100);  //显示遮罩
        silder.css('right',0);//显示右滑块
    }
    function hideSilder() {
        // console.log(666) 滑块右移
        mask.fadeOut();
        silder.css('right',-silder.width())

    }
 silder_bar.on('click',showSilder);
 mask.on('click',hideSilder);
    // 返回顶部
    var top = $('.top')
    top.on('click',function () {
        // console.log(666)
        $('body,html').animate({
            scrollTop:0
        },300)

    });
 /*  显示小火箭第一种写法
    $(window).on('scroll',function () {

            if($(window).scrollTop()>$(window).height()){

             top.fadeIn()
        }else{
            top.fadeOut()
        }

    });
    $(window).trigger('scroll')
显示小火箭第二种写法   要先在.top 中写上dispaly  none*/

    $(window).on('scroll',function () {
        //滚动条在100px以内不显示箭头
        if($(window).scrollTop()<100){
            top.css('display','none')
        }else{
            top.css('display','block')
        }


    });

//点击首页  天页 地页  切换，被点项目激活，兄弟取消激活
        $('.nav_ul li').click(function () {
            $(this).addClass('active')
            $(this).siblings().removeClass('active')
        })


});