【移动端】某个元素上滑隐藏，滑动到第一屏显示

全栈程序员-站长 • 2021年6月14日下午4:00 • 未分类 • 阅读 74

【移动端】某个元素上滑隐藏，滑动到第一屏显示

css:

.first-screen .swiper-arrow{
   
    position:fixed;
    bottom:0.9375rem;
    left:50%;
    margin-left:-0.4rem;
    width:0.8rem;
    height:0.5rem;
    background:url(../../../images/upglide_icon@2x.png) center no-repeat;
    background-size:cover;
    -webkit-animation: twinkling 1s infinite ease-in-out;
}
@-webkit-keyframes twinkling{    /*透明度由0到1*/
    0%{
        opacity:0; /*透明度为0*/
    }
    50%{
   
        opacity:0.5; /*透明度为0.5*/
    }
    100%{
   
        opacity:1; /*透明度为1*/
    }
}

html

<span class="swiper-arrow"></span>

js:

$(window).scroll(function () {
    // 滚动条距离顶部的距离 大于 200px时
    if($(window).scrollTop() >= 200){
        $(".swiper-arrow").css('display', 'none');
    } else{
            $(".swiper-arrow").css('display', 'block');
    }
});

作者：smile.轉角

QQ：493177502

转载于:https://www.cnblogs.com/websmile/p/9773713.html

版权声明：本文内容由互联网用户自发贡献，该文观点仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容，请联系我们举报，一经查实，本站将立刻删除。

发布者：全栈程序员-站长，转载请注明出处：https://javaforall.net/101376.html原文链接：https://javaforall.net

移动移动端

赞 (0)

0 0

关于作者

全栈程序员-站长

133.5K 文章

3 粉丝

本网站汇聚当前互联网主流语音，持续更新，欢迎关注公众号“全栈程序员社区”

上一篇 2021年6月14日下午4:00

Python那么火，到底能用来做什么？我们来说说Python3的主要应用

下一篇 2021年6月14日下午5:00

对供应商锁定说不：为原生资产建立一个开放的跨链桥标准[通俗易懂]

对供应商锁定说不：为原生资产建立一个开放的跨链桥标准[通俗易懂]我们将与大家一起建立开放的原生资产跨链桥标准，将用户、dApp开发者和区块链生态的利益放在最核心的位置。

全栈程序员-站长
2022年5月25日
36
list C++实现

list C++实现

全栈程序员-站长
2021年11月13日
65
脉冲雷达信号处理流程

脉冲雷达信号处理流程1 FPGAAD 采集回波连续 M 个脉冲回波经过相干解调之后的基带数据形成的一个二维数据矩阵上图只是雷达三维数据块的一个切面其中数据的每一行代表的是对同一个距离单元的一连串脉冲测量每一列对应的是一个脉冲回波的连续采样也叫连续的距离门其中每个小方块的元素都是一个复数代表每个个距离单元的 I Q 分量 2 IQ 路信号进行数字下变频处理核心是将中频 A D 采样信号与 DDC 中的数字控制振荡器 NCO 产生的本地数字中频载波信号进行混频将中频信号下变频到基带 3 滤波处理

全栈程序员-站长
2026年3月26日
1
C# Sort排序

C# Sort排序List的Sort方法排序有三种结果1,0，-1分别表示大于，等于，小于。1.对于数值类型的List(List)，直接使用Sort进行排序。ListscoreList=newList(){89,100,78,23,67};scoreList.Sort();//默认按升序排列，相当于：scoreList.Sort((x,y)=>x.CompareTo(y))scoreLis

全栈程序员-站长
2022年7月15日
19
dataframe填充缺失值_pandas填充空值

dataframe填充缺失值_pandas填充空值如果单独是>>>df.fillna(0)>>>print(df)#可以看到未发生改变>>>print(df.fillna(0))#如果直接打印是可以看到填充进去了>>>print(df)#但是再次打印就会发现没有了，还是Nan将其Nan全部填充为0，这时再打印的话会发现根本未填充，这是因…

全栈程序员-站长
2022年8月12日
7
韦根36协议_韦根26协议

韦根36协议_韦根26协议)ID[5]=DM;}RcvWG[0]=0;RcvWG[1]=0;RcvWG[2]=0;RcvEven=0;RcvOdd=0;CheckEven=0;CheckOdd=1;temp=0;Rcnt=0;RWGcnt=0;RCVOK=1;}}if(RCVOK)//读卡成功后，延时，再开始读下一次{EX0=0;for(i=200;i>0;i–)delay();EX0=1;}if(ClrDo…

全栈程序员-站长
2025年5月31日
7

发表回复

关注全栈程序员社区公众号