Внедрение и выход Div с CSS
-o-transition:color .3s ease-out, background .5s ease-in-out;
-ms-transition:color .3s ease-out, background .5s ease-in-out;
-moz-transition:color .3s ease-out, background .5s ease-in-out;
-webkit-transition:color .3s ease-out, background .5s ease-in-out;
transition:color .3s ease-out, background .5s ease-in-out;
Я пытаюсь добавить и исчезнуть div-объект. Посмотри на скрипку. Я сделал затухание особенно долго, чтобы увидеть проблему.
Пункты меню (канада, германия и т. Д.) На ролловере работают нормально (то есть постепенно исчезают), но при развертывании не исчезают.
может кто-то заметить ошибку?
Спасибо!
ЛИНИИ 40-47 CSS-код, где код перехода он находится:)
1 ответ
Решение
Причина, по которой ваш переход обрезается таким образом, заключается в том, что у вас есть переход только на: hover, что вам нужно сделать, это на самом деле переместить это на селектор, который вы хотите перейти, так:
.collapsible, .page_collapsible {
margin: 0;
padding:8px;
height:20px;
border-top:#2b2b2b 1px solid;
border-left:#2b2b2b 1px solid;
border-right:#2b2b2b 1px solid;
border-bottom:#2b2b2b 0px solid;
background: black;
font-family: Lato;
text-decoration:none;
text-transform:uppercase;
color: #fff;
font-size:1em;
-o-transition:color .3s ease-out, background .5s ease-in-out;
-ms-transition:color .3s ease-out, background .5s ease-in-out;
-moz-transition:color .3s ease-out, background .5s ease-in-out;
-webkit-transition:color .3s ease-out, background .5s ease-in-out;
transition:color .3s ease-out, background .5s ease-in-out;
}
Вот обновленная скрипка: http://jsfiddle.net/LJdAU/1/