переход css3: другое значение времени, когда: hover In чем Out? - PullRequest
4 голосов
/ 14 января 2012

В основном я пытаюсь иметь другое время перехода, когда элемент находится при наведении мыши, чем когда элемент отпущен мышью,

#bar{ position:fixed; bottom:-25px; }  /*here you only get to see a piece of the bar    */

#bar:hover{ transform: .2s linear; bottom:0; }

И что-то вроде

/*this only represents my made out status to cover what i need*/
#bar:mouseLeaved{ transform: 2s linear }

Таким образом, это будетзаймет 0,2 секунды для отображения и 2 секунды для скрытия

Могу ли я сделать это без необходимости JavaScript?

1 Ответ

10 голосов
/ 14 января 2012

Я бы предложил это:

#bar { transition: 2s linear; }
#bar:hover { transition: .2s linear; }

И пусть упорядочение CSS обрабатывает все за вас, когда: hover действует (он переопределит другое).

Рабочая демонстрация здесь: http://jsfiddle.net/jfriend00/Hufxa/

...