我的左边的菜单和子菜单覆盖了整个页面的低带宽

Question

我有一个左边的菜单，当我将鼠标悬停在菜单项上时打开一个子菜单，当点击子菜单时，如果互联网速度慢，背景覆盖整个页面，然后恢复原样。

CSS

@media (min-width: 478px) { 
    nav.main-menu { 
     position: absolute; 
     top: 72px; 
     left: 0; 
     z-index: 1010; 
     overflow: hidden; 
     width: 60px; 
     height: 100%; 
     background: #333333; 
     -moz-transform: translateZ(0) scale(1, 1); 
     -ms-transform: translateZ(0) scale(1, 1); 
     -o-transform: translateZ(0) scale(1, 1); 
     -webkit-transform: translateZ(0) scale(1, 1); 
     -moz-transition: width 0.05s linear; 
     -o-transition: width 0.05s linear; 
     -webkit-transition: width 0.05s linear; 
     transition: width 0.05s linear; 
     transform: translateZ(0) scale(1, 1); 
    } 

    nav.main-menu > ul { 
     margin: 7px 0; 
    } 

    nav.main-menu li { 
     position: relative; 
     display: block; 
     width: 250px; 
    } 
} 

如何解决这一问题？

Answer 1

删除这部分，它工作得很好：

-moz-transform: translateZ(0) scale(1, 1); 
    -ms-transform: translateZ(0) scale(1, 1); 
    -o-transform: translateZ(0) scale(1, 1); 
    -webkit-transform: translateZ(0) scale(1, 1); 
    -moz-transition: width 0.05s linear; 
    -o-transition: width 0.05s linear; 
    -webkit-transition: width 0.05s linear; 
    transition: width 0.05s linear; 
    transform: translateZ(0) scale(1, 1);