Вопросы с тегом «css-transitions»

Я пытаюсь сделать <ul>слайд вниз, используя CSS-переходы. Начало <ul>начинается в height: 0;. При наведении высота установлена ​​на height:auto;. Тем не менее, это заставляет его просто появляться, а не переход, Если я сделаю это от height: 40px;до height: auto;, то он будет скользить вверх height: 0;, а затем внезапно прыгнет на …

2136 css  css-transitions 

В настоящее время я разрабатываю «мега раскрывающееся» меню CSS - в основном обычное выпадающее меню только для CSS, но содержащее различные типы контента. На данный момент, похоже, что переходы CSS 3 не применяются к свойству display , то есть вы не можете делать какие-либо переходы из display: noneв display: block(или …

1450 css  css-transitions 

Кажется, я не могу найти правильный синтаксис для сокращения CSS-перехода с несколькими свойствами. Это ничего не делает: .element { -webkit-transition: height .5s, opacity .5s .5s; -moz-transition: height .5s, opacity .5s .5s; -ms-transition: height .5s, opacity .5s .5s; transition: height .5s, opacity .5s .5s; height: 0; opacity: 0; overflow: 0; } …

519 css  webkit  css-transitions  shorthand 

Можно ли использовать CSS-переходы, чтобы позволить текстовому абзацу постепенно появляться при загрузке страницы? Мне очень нравится, как это выглядит на http://dotmailapp.com/, и я бы хотел использовать подобный эффект с помощью CSS. С тех пор домен был куплен и больше не имеет упомянутого эффекта. Архивная копия может быть просмотрена на Wayback …

442 css  css-transitions  opacity 

Это довольно простой вопрос, но я не могу найти очень хорошую документацию по свойствам перехода CSS. Вот фрагмент кода CSS: .nav a { text-transform:uppercase; text-decoration:none; color:#d3d3d3; line-height:1.5 em; font-size:.8em; display:block; text-align:center; text-shadow: 0 -1.5em 0 rgba(255, 255, 255, 0.15); -webkit-transition: color .2s linear; -moz-transition: color .2s linear; -o-transition: color .2s …

327 animation  css  css-transitions 

Я пытаюсь перейти при наведении курсора на миниатюру, чтобы при наведении фоновый градиент исчез. Переход не работает, но если я просто изменил его на rgba()значение, он работает нормально. Градиенты не поддерживаются? Я тоже попробовал использовать изображение, оно тоже не будет переходить. Я знаю, что это возможно, как в другом посте, …

215 css  gradient  css-transitions 

Можно ли использовать анимацию перехода CSS3 при загрузке страницы без использования Javascript? Это то, что я хочу, но при загрузке страницы: http://rilwis.googlecode.com/svn/trunk/demo/image-slider.html Что я нашел до сих пор CSS3 transition-delay , способ задержки эффектов на элементах. Работает только при наведении. Ключевой кадр CSS3 , работает под нагрузкой, но очень медленно. …

196 css  webkit  css-transitions  css-animations 

Есть ли какие-либо события, запускаемые элементом для проверки начала или окончания перехода css3?

190 javascript  events  css  transition  css-transitions 

Существует ли кросс-браузерное решение для создания слайд-перехода только с CSS, без javascript? Ниже приведен пример содержимого HTML: <div> <img id="slide" src="http://.../img.jpg /> </div>

178 css  css-transitions 

Итак, я понимаю, как выполнять CSS3-переходы и анимацию. Что не ясно, и я погуглил, это когда использовать какой. Например, если я хочу сделать отскок мяча, ясно, что анимация - это путь. Я мог бы предоставить ключевые кадры, и браузер сделал бы промежуточные кадры, и у меня будет хорошая анимация. Однако …

157 css  css-transitions  css-animations 

Я пытаюсь создать эффект постепенного появления и исчезновения с помощью перехода CSS. Но я не могу заставить это работать с фоновым изображением ... CSS: .title a { display: block; width: 340px; height: 338px; color: black; background: transparent; /* TRANSITION */ -webkit-transition: background 1s; -moz-transition: background 1s; -o-transition: background 1s; transition: …

122 css  background  background-image  css-transitions 

Итак, у меня есть следующие переходы css, прикрепленные к элементу a: a { -webkit-transition:color 0.1s ease-in, background-color 0.1s ease-in ; -moz-transition:color 0.1s ease-in, background-color 0.1s ease-in; -o-transition:color 0.1s ease-in, background-color 0.1s ease-in; transition:color 0.1s ease-in, background-color 0.1s ease-in; } Есть ли способ отключить эти унаследованные переходы для определенных элементов a? …

117 css  transitions  css-transitions 

.item:hover { zoom: 1; filter: alpha(opacity=50); opacity: 0.5; -webkit-transition: opacity .15s ease-in-out; -moz-transition: opacity .15s ease-in-out; -ms-transition: opacity .15s ease-in-out; -o-transition: opacity .15s ease-in-out; transition: opacity .15s ease-in-out; } Почему это анимирует непрозрачность только при наведении курсора, но не когда я оставляю объект с помощью мыши? Демо здесь: http://jsfiddle.net/7uR8z/ ​

115 css  css-transitions 

В чем разница между CSS3 переходов ease-in, ease-outи т.д.?

113 css  css-transitions 

Я хотел бы применить переход CSS ко всем свойствам, кроме background-position. Я пытался сделать это так: .csstransitions a { -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -o-transition: all 0.3s ease; -ms-transition: all 0.3s ease; transition: all 0.3s ease; } .csstransitions a { -webkit-transition: background-position 0s ease 0s; -moz-transition: background-position …

109 css  css-transitions