关于加了position:fixed的浏览器滚动问题

顶部导航栏加了position:fixed属性后,当窗口缩放后拉动滚动条,顶部导航栏不随之滚动,


我们可以这样解决

在js代码中加如下代码:

window.onscroll = function() {

var sl = -Math.max(document.body.scrollLeft,document.documentElement.scrollLeft);

document.getElementById('fixed').style.left = sl + 'px';

console.log(sl);

}


可能在手机浏览时还会出现这个问题再把它的css代码加上overflow-x: hidden即可

.head {

background: #fff;

position: fixed;

z-index: 100;

min-width: 1200px;

    height: 60px;

    background: #fff;

    top: 0;

    bottom: 0;

  /* overflow-x: scroll;*/

    overflow-x: hidden;

}

©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 1. tab列表折叠效果 html: 能源系统事业部 岗位名称: 工作地点 岗位名...
    lilyping阅读 1,909评论 0 1
  • 本书介绍 你是不是对Django的学习感到迷茫?是不是对网上零星的教程感到绝望?是不是苦于没有可以迅速上手的实例而...
    阡陌3536阅读 1,339评论 0 0
  • 1、电脑配置 操作系统:win10 系统类型:64位 内存:16g 处理器:i7-6700k CPU @ 4.00...
    泥坑里的一块泥阅读 276评论 0 0
  • 最近遇到的事很多,有两件让我印象特别深刻,原因是太遗憾,太后悔。 第一件就是丢了小猫,在十字路口一撒手,就再也没见...
    吆拐拐阅读 193评论 0 1
  • 今年的寒假在与同学的对比下显得格外的漫长,可能是因为我的学校离家远,从大西北到大东北,让我的寒假比大家都长了些。前...
    长鹿茸的花栗鼠阅读 216评论 0 1