Как исчезнуть в фоновом изображении с помощью CSS3 Animation

Я создаю меню, в котором у каждого элемента есть текст, такой как item1, item2 и т. Д. При наведении фона цвет меняется, текст становится прозрачным, а фоновое изображение заменяется. Я использовал этот код, чтобы облегчить стиль. но это работает только для цвета фона, а не изображения.

#nav li:hover {
    color:transparent !important;
    text-shadow: none;
    background-color: rgba(255, 0, 0, .5);

    -webkit-transition: all 1s ease-in;
    -moz-transition: all 1s ease-in;
    -o-transition: all 1s ease-in;
    -ms-transition: all 1s ease-in;
    transition: all 1s ease-in;
}

Вот онлайн-версия:http://jsfiddle.net/q4uHz/

Ответы на вопрос(1)

Ваш ответ на вопрос