CSS3 box-shadow 属性导致菜单下拉平滑度答案

【问题标题】：CSS3 box-shadow property is Causing The Menu Drop Down SmoothnessCSS3 box-shadow 属性导致菜单下拉平滑度
【发布时间】：2011-01-13 08:07:19
【问题描述】：

我正在使用jQuery Multi Level CSS Menu #2 作为我的一个 wordpress 主题。

但是当我在主 div 中添加 CSS3 box-shadow 属性作为背景框阴影时，菜单下拉效果会变慢，并且不像预期的那样平滑。

但是当我从主 div 中移除 CSS3 box-shadow 属性时，菜单下拉效果变得非常平滑。这是我的主要 div：

#main {  background: #fff; margin-top:20px; margin-bottom:0px; -moz-box-shadow: 0 0 10px #000000;
   -webkit-box-shadow: 0 0 10px #000000;
   box-shadow: 0 0 10px #000000;
}

我是不是做错了什么？

【问题讨论】：

请提供一些代码......你的“主要”在你的 html 中包含什么？

标签： css dropshadow

【解决方案1】：

动画阴影非常慢，因为每次移动时都必须重新计算。如果您减小阴影的半径，您将看到性能提升，即：

-webkit-box-shadow: 0 0 3px #000000;

但我会放弃阴影（哈哈！）并改用半透明边框：

 border: solid #ccc 10px; /*for older browsers*/
 border: solid rgba(255,255,255,0.3) 10px; /*transparent border*/

【讨论】：