: после перехода не работает

Question

Почему переход не работает в псевдоэлементе: после /: before.

Я просто пытаюсь поместить это в свой css, но нет, не работает.

.edicao-fotos-2 li a:hover{ 
transition:0.6s; 
-o-transition:0.6s; 
-ms-transition:0.6s; 
-moz-transition:0.6s; 
-webkit-transition:0.6s; 
} 

.edicao-fotos-2 li a:hover:after{ 
content: ''; 
width:244px; 
height:243px; 
background:rgba(0, 0, 0, 0.6); 
position:absolute; 
top:-228px; 
left:0; 
transition:0.6s; 
-o-transition:0.6s; 
-ms-transition:0.6s; 
-moz-transition:0.6s; 
-webkit-transition:0.6s; 
} 

Все спасибо.

Answer 1

Все works fine в Chrome 32. Может возникнуть проблема в order и value синтаксис. Попробуйте выполнить другой заказ и добавьте не только значение задержки:

-o-transition: all 0.6s; 
-ms-transition: all 0.6s; 
-moz-transition: all 0.6s; 
-webkit-transition: all 0.6s; 
transition: all 0.6s; 

Все изменения на вашей недвижимости.

Answer 2

У вас нет значений по умолчанию для .edicao-fotos-2 li a:after.

/** 
* example values: 
* this will animate width and height 
*/ 
.edicao-fotos-2 a:after { 
    content: ""; 
    width: 0; 
    height: 0; 
} 

.edicao-fotos-2 li a:hover:after{ 
    content: ''; 
    width:244px; 
    height:243px; 
    background:rgba(0, 0, 0, 0.6); 
    position:absolute; 
    top:-228px; 
    left:0; 

    -webkit-transition:0.6s; 
     -moz-transition:0.6s; 
     -ms-transition:0.6s; 
     -o-transition:0.6s; 
      transition:0.6s; 
} 

Если вы не применяете значения по умолчанию, браузер не будет знать, как начать анимацию.

DEMO

Примечание: Вы также должны написать свои правила перехода, начиная с префиксами поставщика, а не наоборот.