首页 > 其他分享 >锚点定位滚动之 scrollIntoView,定位的锚点内容被遮挡

锚点定位滚动之 scrollIntoView,定位的锚点内容被遮挡

时间:2023-05-30 14:33:29浏览次数:57  
标签:定位 滚动 scrollIntoView 遮挡 top 内容 锚点


问题描述:
点击‘蓝色’框里的内容,‘绿色’框里面的内容滚动到可试区域内,由于‘红色’搜索框的原因,’绿色‘要展示的可视区域被搜索框的内容遮挡。
原来的布局:

解决:让滚动区也以fixed做呈现,top值定为顶部区域的高度即可不被遮挡;给class="bottom" 的标签添加‘position:fixed;top:52px(搜索框的高度)’.

标签:定位,滚动,scrollIntoView,遮挡,top,内容,锚点
From: https://www.cnblogs.com/duocaishijie/p/17443164.html

相关文章

  • python+playwright 学习-66 highlight 调试定位时高亮显示元素
    前言highlight()方法是通过高亮显示元素,在调试中有很大优势,可以清楚看到定位的元素所在的位置遇到的问题使用示例:点百度页面,定位文本元素“新闻”后点击fromplaywright.sync_apiimportsync_playwright#上海悠悠wx:283340479#blog:https://www.cnblogs.com/yoyoket......
  • 基于可穿戴的GPS定位存储模块方案特色解析
    前记 GPS作为一个位置定位手段,在日常生活中扮演着非常重要的角色。在研发动物可穿戴产品的同时。团队一直在做产品和模块标准化的事情,尽量把研发出来的东西标准化。按照任老板的说法,在追求理想主义的路上,不断孵化现实主义的产品与解决方案,攀登珠峰的征途中沿途下蛋。笔者非常赞......
  • 查看kafka指定位置offset消息
    packagecom.infinitus.cdc.test;importorg.apache.kafka.clients.consumer.ConsumerRecord;importorg.apache.kafka.clients.consumer.ConsumerRecords;importorg.apache.kafka.clients.consumer.KafkaConsumer;importorg.apache.kafka.clients.consumer.OffsetAndM......
  • 直线电机的定位精度与重复定位精度的概念,为什么重复定位精度要比定位精度高
    单纯从直线电机的反馈来看,光栅或磁尺的刻度精度一般都在10-30um,在尺子的精度做不到um级别的情况下,如何能够保证依赖尺子来定位的直线电机的绝对定位精度?而重复定位精度往往只要伺服的PID没什么问题,静态时的PE可以很容易做到1-2个count,如此,重复定位精度一般可以比较容易的做到较高......
  • LORA温度资产定位标签传感器方案
    公司范围内的可追踪设备包括:牵引车、空中吊运车、皮带式装载机、托盘装载器、铲车以及其他可移动的资产设备,使用基于LoRa进行追踪既可以获取实时位置信息也可以分享状态给区域经理。 使用LoRa资产追踪技术,通过监控收集引擎温度、转速、油压或者充电状态到云端,使用者可以利用手机、......
  • Springboot集成百度地图实现定位打卡功能
    打卡sign表sqlCREATETABLE`sign`(`id`int(11)NOTNULLAUTO_INCREMENT,`user`varchar(255)COLLATEutf8mb4_unicode_ciDEFAULTNULLCOMMENT'用户名称',`location`varchar(255)COLLATEutf8mb4_unicode_ciDEFAULTNULLCOMMENT'打卡位置',`......
  • 指定位置插入字符
    1.问题描述编写程序实现以下功能:在字符串中的所有数字字符前加一个$字符,例如,输入A1B23CD45,输出A$1B$2$3CD$4$52.问题分析用串S拷贝出另一个串T,对T从头到尾扫描,对非数字字符原样写入串S,数字字符先写一个$再写数字字符,最后在S串尾加结束标志。3.程序#include<iostream>using......
  • Html5定位不准确问题
    if(navigator.geolocation){navigator.geolocation.getCurrentPosition(getPosition,getPositionError,{//指示浏览器获取高精度的位置,默认为falseenableHighAccuracy:true,//指定获取地理位置的超时时间,默认不限时,单位为毫秒......
  • Cesium将相机定位到指定的位置
    使用Cesium的viewer.camera.flyTo方法将相机定位到指定的位置,并设置相机的方向和倾斜角。viewer.camera.flyTo({//摄像机在WGS84(世界)中的最终位置坐标或从自上而下的视图中可以看到的矩形destination:Cesium.Cartesian3.fromDegrees(113,23,8000.0),//包含方向和......
  • Appium自动化(5):元素定位工具
    常用元素定位工具使用uiautomatorviewer定位工具:元素定位主要用来获取元素信息,获取元素信息后才能用appium提供的相关API去识别和操作元素。谷歌在AndroidSDK中,提供了元素定位工具uiautomatorviewer,该工具可在android-sdk安装路径下找到:<android-sdk>\tools\uiautomatorviewer.bat......