彻底改掉搜狗搜索、CSDN页面上悬浮标题栏的滚动BUG

博客指出Sogou搜索与CSDN前端存在的一个严重BUG,导致页面滚动时Y轴偏移不连续,影响用户体验。文章提供临时解决方案,通过禁用悬浮特效的CSS代码,修复这一问题,强调前端开发者应注意避免此类低级错误。
摘要由CSDN通过智能技术生成

  都说前端上限高于天,奈何做出特效卡成翔。这不,Sogou搜索与CSDN的前端“门面”上,一个大BUG赫然显示于诸君面前,滚动的时候,页面的Y轴偏移不是连续变化的,而是在顶部硬生生地跳过了一段距离,造成页面上下横跳的BUG,严重影响用户体验。

  什么,你觉得这样的BUG很小,甚至根本算不上什么?我的天哪,每次打开首页、每次浏览正文、每次搜索、每次翻页,此BUG都会往你脸上呼,如此大胆而嚣张的BUG,哪里还小了?

禁用搜狗搜素的悬浮搜索栏

.headsearch{
    position: unset!important;
}

.header.headsearch {
    padding:12px 0 45px!important;
}


.searchnav, .top-bar {
    display: block!important;
}

.top-hintBox {
    display: unset!important;
}

禁用CSDN的悬浮标题栏

#csdn-toolbar{
    
    position: relative!important; top: 0px!important; left: 0px!important; width:    100%!important;
    
}

(只能算是临时方案,需要粘贴到Stylus等浏览器的样式管理扩展上使用,通过禁用悬浮特效的方式,彻底解决此问题。)

这个故事告诉我们,用胸怀天下的心搭建框架后,千万不要用脚写BUG!

千万不要用脚写BUG!

千万不要用脚写BUG!

千万不要用脚写BUG!
千万不要用脚写BUG!
千万不要用脚写BUG!

千万不要用脚写BUG!

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值