Question

Есть такие строчки в моем css:

.logo {
 padding:10px 0px 10px 30px;
 margin-bottom:20px;
background: url(/winter-2015/logo_b.png);
 width:270px;
 height:60px;

}
.logo:hover {
background: url(/winter-2015/logo_r.png);
}

Хочу сделать так, чтобы при наведении фон менялся плавно. Пытался добавить в .logo вот это:

 -moz-transition:background 0.5s 0.1s ease;
-o-transition: background 0.5s 0.1s ease;
-webkit-transition: background 0.5s 0.1s ease;

Но эффекта никакого нет.

Answer 1

Попробуйте стили в таблице стилей CSS строка номер 214, заменить на:

.logo:hover {
background: url(/winter-2015/logo_r.png);
transition: 3s;
-moz-transition: 3s;
-o-transition: 3s;
-webkit-transition: 3s;
}

вот и все.

Comments

Без изменений

---

С Google Chrome смотрю, все корректно работает. Попробуйте несколько раз выполнить комбинацию клавиш - CTRL+F5

---

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

---

против мозиллы не понятно что применять, как видим данный параметр как-бы не учитывается - -moz-transition: 3s; интересно

---

Поищу что-нибудь по этому поводу. Спасибо)