Как сделать эффекты при наведении?

Question

[viktorulyushev]

Есть блок,при наведении он покрывается полупрозрачным слоем,как добавить какой нибудь эффект при наведении?например чтобы в разные стороны расходился бэкграунд?или хотя бы чтобы перекрывающий цвет появлялся плавно https://jsfiddle.net/q5r4atmt/ там немного поехало,но это нормально

Comments

[Яхья]

как вариант можно порезать фото на две части а при наведени ставить для блоков (картинок) отрицательное положение

Answer 1

[k0nsu1]

Используйте свойство css transition

Comments

[k0nsu1]

и при hover меняйте положение накладываемого слоя, так он будет плавно выезжать.

[viktorulyushev]

k0nsu1: можете на моем примере показать?transition не хочет рабоать https://jsfiddle.net/q5r4atmt/

[Андрей Токмаков]

viktorulyushev: Может быть он не хочет работать потому что у Вас там не понятная каша и полный бред?

Answer 2

[Егор Живагин]

Свойство display не анимируется в принципе. Больше ничего не могу сказать, т.к. не очень хочется вникать в кашу в вёрстке и стилях

При такой любви к вложенности вам очень подошли бы препроцессоры sass, scss. И читабильнее бы было

Вместо display можно менять opacity и z-index