zoukankan      html  css  js  c++  java
  • js滚动触发事件 改变Class

    //定义一个记录滚动事件状态的数组
    window['my_scroll']=Array;
    var t;
    $(window).scroll(function(){
      //获取滚动高度,可做触发次数限制 t = document.documentElement.scrollTop||document.body.scrollTop; })

    //_class需要操作的div //o通过这个获取触发条件高度;可填写数字或者className;
    //add_class 新增的className
    //remove_class 是否开启回滚取消className 默认0不开启,执行一次addClass操作后就不会再删除了 //触发条件高度 num偏移量,只能填整数 function WinScroll(_class,o,add_class,remove_class=0,num=0){ var top;//保存触发条件高度 if(typeof(o)=="number"){//是否是数字 top=o+num; }else{ if($(o).length > 0){//是否找到元素,找不到就退出函数 top= $(o).offset().top top+=num; }else{ return } } window['my_scroll'][_class]=true; $(window).scroll(function(){ if(t>top&&window['my_scroll'][_class]){ $(_class).addClass(add_class); // console.log(_class+"执行add_class"+add_class); window['my_scroll'][_class]=false; }else if(t<=top&&!window['my_scroll'][_class]&&remove_class==1){//删除class $(_class).removeClass(add_class); // console.log(_class+"执行remove_class"+add_class); window['my_scroll'][_class]=true; } }) }

      

    ————勇敢的少年啊 快去创造奇迹————
  • 相关阅读:
    vue项目中兼容ie8以上浏览器的配置
    vue项目中event bus的简单使用
    js中的正则表达式小结1
    sourceTree跳过注册
    日期时间格式化
    阿里矢量图标库的使用
    mySql 常用命令
    php 常用的系统函数
    php mySql常用的函数
    php 关于php创建 json文件 和 对文件增删改查 示例
  • 原文地址:https://www.cnblogs.com/masterccc/p/10220769.html
Copyright © 2011-2022 走看看