zoukankan      html  css  js  c++  java
  • 滚动事件显示/隐藏模块 广东靓仔

    描述:

        滚动界面,当滚到到达某个位置,你需要让某个模块固定在顶部或者底部,然后再你滚动回去后,那个模块恢复原来的模样。

    代码如下:

    JS:

    <script>
    $("body").scroll(function() {               // body滚动事件
    var BMapHeight = -$(".BMap_mask").height();
    var topHeight = $("#scrollEvent").offset().top;      // 你需要的div的位置
    if (topHeight == BMapHeight) {                            // 到达某个特定的点触发事件
    $("#allmap").hide();
    $(".resetPoint").hide();
    $("#newScrollEvent").css("position","fixed");
    $("#newScrollEvent").css("width","100%");
    $("#newScrollEvent").css("background-color","#ffffff");
    $("#newScrollEvent").css("z-index","1011");
    $("#newScrollEvent").css("border-bottom","1px solid #eeeeee");
    }
    if(1<topHeight<10){                                        // 恢复原来的模样
    $("#allmap").show();
    $(".resetPoint").show();
    $("#newScrollEvent").css("position","relative");
    $("#newScrollEvent").css("width","100%");
    $("#newScrollEvent").css("background-color","#ffffff");
    $("#newScrollEvent").css("border-bottom","1px solid #eeeeee");
    }
    });
    </script>

    以上代码只有js,提供思路,希望对你有帮助

  • 相关阅读:
    站立会议02(冲刺2)
    站立会议01(冲刺2)
    测试计划
    cnblogs.com用户体验
    对其他组所提建议的回复(第一阶段)
    对各个小组的评论和一些建议
    团队会议第十天
    团队绩效评估规划
    团队会议第九天
    每日scrum(1)
  • 原文地址:https://www.cnblogs.com/cczlovexw/p/7244070.html
Copyright © 2011-2022 走看看