Question

当鼠标悬停li稍微摆动时，我有菜单。怎么停止那种摆动。

代码在这里 JSFiddle

Answer 1

最简单的方法就是修改css：

.inner LI {
  border: 1px solid transparent;
  padding: 0.25em 1.75em;
  font-family: "Open Sans", "HelveticaNeue", "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-size: 90%;
}

Answer 2

如果我做对了，你想要在悬停时消除摇晃。为此，请删除边框

.inner LI:hover {
    background: #eee;
    -webkit-backface-visibility: hidden;
}

这将是需要更改的代码。如果你真的想要边框样式，请添加box-shadow来实现相同的效果。

希望它有所帮助。

Answer 3

wiggling属性是因为:hover

上有.inner li个事件时添加了边框

正确的CSS：

.inner LI:hover { background: #eee;  -webkit-backface-visibility: hidden;}

代码已更新： JSFiddle

Answer 4

Index.html中的第59行改为：

    .inner LI:hover 
    { 
      border: 1px solid #ddd; 
      background: #eee; 
      -webkit-backface-visibility: hidden;
    }

为：

    .inner LI:hover 
    { 
      background: #eee; 
      -webkit-backface-visibility: hidden;
    }

Answer 5

在.inner LI:hover课程中，您设置了border: 1px solid #ddd;。

但是，您的.inner LI类没有边框，或者是'0px的边框'。

要解决此问题，请尝试将border: 1px solid transparent;添加到.inner LI班级。

如何停止鼠标上的摆动（跳跃）列表菜单项？

5 个答案: