滑动到距离顶部一段距离固定显示搜素栏

最新推荐文章于 2022-05-11 16:51:32 发布

HaiRong_21

最新推荐文章于 2022-05-11 16:51:32 发布

阅读量476

点赞数

文章标签： js

本文链接：https://blog.csdn.net/HaiRong_21/article/details/108451963

版权

本文介绍了使用JavaScript实现网页滚动40像素时固定显示搜索栏的思路。当滚动条滚动超过40像素，搜索栏会显示；若滚动距离不足40像素，则隐藏搜索栏。

摘要由CSDN通过智能技术生成

只是思路，具体的没有做了
（图片放反了）
当滚动条滚动了40px的时候，将搜索栏显示出来，滚动距离没有40px的时候隐藏
在这里插入图片描述

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <style>
        * {
            margin: 0;
            padding: 0;
        }

        .fill {
            width: 100%;
            height: 2000px;
            background-color: rgb(238, 182, 182);
            text-align: center;
            padding: 50px 0;
            font-size: 24px;
        }

        .top_search {
            height: 80px;

最低0.47元/天解锁文章

HaiRong_21

关注

0
点赞
踩
2

收藏

觉得还不错? 一键收藏
0
评论
滑动到距离顶部一段距离固定显示搜素栏

只是思路，具体的没有做了（图片放反了）当滚动条滚动了40px的时候，将搜索栏显示出来，滚动距离没有40px的时候隐藏<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Doc
复制链接

扫一扫