美文网首页
点击Div回到浏览器顶部

点击Div回到浏览器顶部

作者: 酒暖花深Q | 来源:发表于2020-07-26 21:02 被阅读0次
<aside class="first">
    <img src="img/right.png" alt=""/>
</aside>
<div class='second'>
    <a href='javascript:void(0)'></a>
    <a href='javascript:void(0)'></a>
    <a href='javascript:void(0)'></a>
</div>
<script>
$('.second').find('a').eq(0).click(function(){
    $('html,body').animate({scrollTop:0},1000);
});
</script>

当达到一定高度 盒子切换显示

$(window).on('scroll',function(){
    var index =300;
    if($(document).scrollTop()>=300){
        $('.first').hide();
        $('.second').show();
    }
    else if($(document).scrollTop()<162){
        $('.first').show();
        $('.second').hide();
    }
});

相关文章

  • 点击Div回到浏览器顶部

    当达到一定高度 盒子切换显示

  • 代码小积累

    1, 点击 点击链接后不会回到网页顶部 点击 点击后会回到网面顶部 2,清除浮动(clearfix hack)...

  • 点击顶部自动回到顶部

    很多项目都会有这样一个功能,就是点击状态栏后让ScrollView或者子类能够自动滚到顶部。现在我们就来实现这个功...

  • JS返回顶部

    当鼠标滚轮滚到页面底部或中部,需点击一个页面中固定定位的div,让页面回到顶部最开始加载的位置。

  • js 返回页面顶部(动画)

    js 返回到页面顶部,含有渐变或者动画效果 点击返回顶部按钮,页面逐渐向上回到顶部: js 返回到页面顶部,直接返...

  • 模拟手动滑动的效果

    场景:点击一个div后,将这个div移动到顶部并展开,类似流利说的单词卡片学习。talk is cheap 参考:MDN

  • RecyclerView滑动监听

    RecyclerView一键回到顶部 布局 设置一键回到顶部按钮的点击事件 设置回到顶部按钮的显示隐藏 方式1: ...

  • iOS-点击状态栏自动回到顶部功能实现详解

    状态栏(statusBar)点击自动回到顶部效果,旨在为用户在浏览界面时提供便利,点击状态栏能够快速回到界面顶部,...

  • vue3 页面回到顶部(滚动效果)

    要求:1.回到顶部按钮 动态出现 当往下滚动时出现 回到顶部时自动消失2.动画过渡 不要太生硬3.点击回到顶部...

  • vue下返回顶部功能实现

    vue下返回顶部功能实现 Vue中点击按钮回到顶部(滚动效果) vue中回到顶部 vue滚动到一定位置显示置顶元素...

网友评论

      本文标题:点击Div回到浏览器顶部

      本文链接:https://www.haomeiwen.com/subject/ciuglktx.html