zoukankan      html  css  js  c++  java
  • 弹窗随屏幕滚动

    1、
    $(document).ready(function() {
          var menuYloc = $("#offsetTop").offset().top - 350; //此ID为随着屏幕滚动div的ID,这个是获取的距离屏幕顶部的距离
          $(window).scroll(function() {
            var offsetTop = menuYloc + $(window).scrollTop() + "px"; //这个是距离顶部的距离加上滚动的距离
            if ($(window).scrollTop() > 248) {
              $("#offsetTop").animate(
                { top: offsetTop },
                { duration: 300, queue: false }
              ); //此ID为随着屏幕滚动div的ID
            } else {
              $(".offsetTop").animate(
                { top: 220 },
                {
                  duration: 300,
                  queue: false
                }
              ); //此ID为随着屏幕滚动div的ID
            }
          });
        });
    注:标记颜色的部分可根据具体情况更改;
     2、
    $(document).ready(function() {
          var menuYloc = $(".offsetTop").offset().top; 
          $(window).scroll(function() {
            var offsetTop = menuYloc + $(window).scrollTop() + "px";
              $(".offsetTop").animate(
                { top: offsetTop },
                { duration: 300, queue: false }
              );
              $(".offsetTop").animate(
                { top: menuYloc },
                {
                  duration: 300,
                  queue: false
                }
              ); 
          });
        });
  • 相关阅读:
    Mysql(11)_Mysql权限与安全
    Mysql(10)_存储过程与流程控制
    Java(43)_AWT事件处理挂关闭生效
    6.实现合同测试用例
    6.测试库优化
    5.案例回顾及编写测试用例
    4.测试案例实现代码库与测试用例V2.0
    3.测试案例实现代码库与测试用例
    markdown语法学习
    1.faker批量随机造数据
  • 原文地址:https://www.cnblogs.com/lljun/p/12320823.html
Copyright © 2011-2022 走看看