zoukankan      html  css  js  c++  java
  • 内容导航滚动最顶端的时候 固定

    .fixed {position: fixed;top: -5px;left: 0; 100%;box-shadow: 0 0 3px #f2f2f2;-webkit-box-shadow: 0 0 3px #f2f2f2;-moz-box-shadow: 0 0 3px #f2f2f2;}

    //nav fixed
    var menu = $('.usernav'),
    pos = menu.offset();

    $(window).scroll(function () {
    if ($(this).scrollTop() > pos.top + menu.height() && menu.hasClass('default')) {
    menu.fadeOut('fast', function () {
    $(this).removeClass('default').addClass('fixed').fadeIn('fast');
    });
    } else if ($(this).scrollTop() <= pos.top && menu.hasClass('fixed')) {
    menu.fadeOut('fast', function () {
    $(this).removeClass('fixed').addClass('default').fadeIn('fast');
    });
    }
    });//end

    //left固定
    $(".leftnav").width($(".leftbar").width())
    var leftnav = $('.leftnav');
    pos = leftnav.offset();
    posL= leftnav.offset().left;

    $(window).scroll(function () {
    if ($(this).scrollTop() > pos.top && leftnav.hasClass('default')) {
    $('.leftnav').removeClass('default').addClass('fixed');
    $('.leftnav').css("left",posL)
    }
    else if ($(this).scrollTop() <= pos.top && leftnav.hasClass('fixed')) {
    $('.leftnav').removeClass('fixed').addClass('default');
    $('.leftnav').css("left",posL)
    }
    });//end

  • 相关阅读:
    RAID实战案例
    文件系统常用工具实战篇
    挂载文件系统
    硬盘结构类型概述
    创建文件系统实战篇
    JumpServer的会话管理及命令过滤器应用案例
    JumpServer的权限管理
    JumpServer的用户管理
    helm基础
    hpa控制器
  • 原文地址:https://www.cnblogs.com/aimyfly/p/3754647.html
Copyright © 2011-2022 走看看