CSS3 box-shadow свойство вызывает гладкость выпадающего меню - PullRequest
Новая
       7

CSS3 box-shadow свойство вызывает гладкость выпадающего меню

0 голосов
/ 13 января 2011

Я использую Многоуровневое меню jQuery CSS # 2 для одной из моих тем WordPress.

Но когда я добавляю свойство CSS3 box-shadow в свой основной div для фонового блокатень, чем эффект выпадающего меню становится медленнее, и не так гладко, как должно быть.

Но когда я удаляю, свойство CSS3 box-shadow из основного div, чем выпадающее менюэффект становится идеально плавным.Это мой основной 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;
}

Я что-то не так делаю?

1 Ответ

0 голосов
/ 13 января 2011

Анимированные тени очень медленные, потому что их нужно пересчитывать при каждом движении.Вы увидите улучшение производительности, если вы уменьшите радиус своей тени, например: 

-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*/
...