css - 向上滚动时奇怪的消失网站(仅在 Chrome 中)
问题描述
所以这有点奇怪。(仅限)在Chrome浏览器中,当向上滚动到顶部时(用两根手指而不是侧边栏),我的内容似乎消失了。向下滚动后,它再次可见。我附上截图,因为你们中的一些人可能看不到这个错误。
我的网站地址:https : //londonim.co.il 我改用了名为CuteWP 的网站,它是所有这些新问题的根源。
我怀疑与 webkit 的不透明度设置和动画以及粘性导航菜单有关,因为当我在开发人员模式下检查它时,我可以看到它
<div class=cutewp-scroll-top'>
正在获取一个display:none
属性。
但是我不能确定这是问题所在。我最好的猜测在于滚动条的样式代码。然而,这只是一个猜测,摆弄这里的不透明度仍然没有结果。这是我的主要嫌疑人的代码:
/* Scroll to Top Button
-------------------------------------------------------------- */
.cutewp-scroll-top{background:#000000 left top no-repeat url(assets/images/scroll-top.png);border:1px solid black;cursor:pointer;display:block;height:29px;opacity:.4;filter:alpha(opacity=40);position:fixed;bottom:20px;right:20px;width:29px;z-index:200;}
.cutewp-scroll-top:hover{opacity:1;filter:alpha(opacity=100);-webkit-transition:opacity 1s;transition:opacity 1s;}
.cutewp-box{background:#fff;padding:15px;border:1px solid #dddddd;-webkit-box-shadow:0 0 40px rgba(0,0,0,.1) inset;-moz-box-shadow:0 0 40px rgba(0,0,0,.1) inset;box-shadow:0 0 40px rgba(0,0,0,.1) inset;}
.cutewp-animated{-webkit-animation-duration:2s;-moz-animation-duration:2s;-o-animation-duration:2s;animation-duration:2s;-webkit-animation-fill-mode:both;-moz-animation-fill-mode:both;-o-animation-fill-mode:both;animation-fill-mode:both;}
@-webkit-keyframes cutewp-fadein{from{opacity:0;}to{opacity:1;}}
@-moz-keyframes cutewp-fadein{from{opacity:0;}to{opacity:1;}}
@-o-keyframes cutewp-fadein{from{opacity:0;}to{opacity:1;}}
@keyframes cutewp-fadein{from{opacity:0;}to{opacity:1;}}
.cutewp-fadein{-webkit-animation-name:cutewp-fadein;-moz-animation-name:cutewp-fadein;-o-animation-name:cutewp-fadein;animation-name:cutewp-fadein;}
我还注意到,当错误
<div class="cutewp-container cutewp-primary-menu-container clearfix cutewp-fixed">
发生时,<div class="cutewp-container cutewp-primary-menu-container clearfix">
我无法找到此更改的命令行。
会很感激这方面的帮助,尽管我意识到这比人们通常应该提出问题的方式有点模糊。
非常感谢,
乔尼
解决方案
这是overflow
网站的常见问题。要缓解此类问题,您只需在custom css
设置中添加以下代码:
body {overflow:hidden !important;}
这将应用隐藏overflow
以避免不必要的滚动选项卡。
推荐阅读
- javascript - 使用函数删除c3中的图形
- graphviz - 使用集群反转 rank=same 的顺序
- java - 如何在springboot中动态创建表?
- javascript - JSON JWT 令牌对象 - 格式错误的 UTF-8 数据 - Crypto JS
- continuous-integration - Gitlab Windows runner 收到作业时转为不运行
- java - 为什么日期转换返回不同的时间戳?
- python-3.x - python记录到另一个文件/目录的问题
- javascript - 调用后 setState 不会更新所有状态属性
- html - 在 iframe 中集成远程表单
- swift - 无法将类型“()”的值分配给完成处理程序中的类型“[Category]”