Запитання з тегом «css-transitions»

У наведеній нижче скрипці я перейшов окремо до видимості та непрозорості. Останній працює, але перший не робить. Більше того, у випадку видимості час переходу трактується як затримка при наведенні курсору. Відбувається в Chrome і Firefox. Це помилка? http://jsfiddle.net/0r218mdo/3/ Випадок 1: #inner{ visibility:hidden; transition:visibility 1000ms; } #outer:hover #inner{ visibility:visible; } Випадок …

102 css  css-transitions 

Чи можливо отримати сповіщення (наприклад, зворотний дзвінок), коли перехід CSS завершено?

100 javascript  css  css-transitions 

Я намагаюся реалізувати ефект "згасання" в чистому CSS. Ось скрипка . Я вивчив кілька рішень в Інтернеті, однак, прочитавши документацію в Інтернеті , я намагаюся зрозуміти, чому анімація слайдів не працює. Будь-які вказівники? .dummy-wrap { animation: slideup 2s; -moz-animation: slideup 2s; -webkit-animation: slideup 2s; -o-animation: slideup 2s; } .success-wrap { …

96 css  css-transitions 

Кінцева подія переходу Webkit називається webkitTransitionEnd, Firefox перехідEnd, opera - oTransitionEnd. Який хороший спосіб вирішити їх усіх у чистому JS? Чи слід робити нюхання браузера? або впровадити кожен окремо? Якимсь іншим способом, який мені не спав на думку? тобто: //doing browser sniffing var transitionend = (isSafari) ? "webkitTransitionEnd" : (isFirefox) …

91 javascript  css  css-transitions  dom-events 

У мене є CSS-анімація для div, який ковзає через заданий проміжок часу. Я хотів би, щоб декілька div заповнили простір анімованого div, який ковзає, і потім він висуне ці елементи вниз по сторінці. Коли я спробую це спочатку div, який ковзає, все одно займає місце, навіть коли його не видно. …

84 css  css-transitions  animate.css 

У мене питання про швидкість візуалізації властивості переходу css3. Припустимо, у мене є ряд елементів: div, span, a {transition: all} div {margin: 2px} span {opacity: .5} a:hover {background-position: left top} div:hover {margin: -100px} span:hover {opacity: 1} a:hover {background-position: -5px top} Набагато ефективніше націлити всі переходи для всіх цих елементів за …

82 performance  css  css-transitions 

Я переміщую 6000 маленьких елементів div в експерименті css3, використовуючи перехід від top: 0до top: 145pxдо тестової продуктивності. Без використання апаратного прискорення в Google Chrome працює гладко. Якщо я ввімкну апаратне прискорення за допомогою translateZ(0)продуктивності, це стає жахливо. Чому це так? Ось мій приклад коду: http://dl.dropboxusercontent.com/u/17844821/tmp/hwtest.html Оновлення (13.11.2014): Оскільки це …

82 css  css-transitions  hardware-acceleration 

Я використовую переходи CSS для переходу між перетвореними станами CSS (в основному переходячи за масштабом елемента). Я помічаю, що коли елемент переходить, решта тексту на сторінці (у Webkit) має тенденцію трохи змінювати його візуалізацію, поки перехід не буде зроблений. Скрипка: http://jsfiddle.net/russelluresti/UeNFK/ Я також помітив, що це не відбувається в моїх …

81 css  webkit  css-transitions  css-transforms 

Як можна збільшити розмір шрифту при наведенні курсора? З часом кольорові переходи працюють нормально, але розмір шрифту чомусь змінюється негайно. Зразок коду: body p { font-size: 12px; color: #0F9; transition:font-size 12s; -moz-transition:font-size 12s; /* Firefox 4 */ -webkit-transition:font-size 12s; /* Safari and Chrome */ -o-transition:font-size 12s; transition:color 12s; -moz-transition:color 12s; …

81 html  css  css-transitions 

У мене є форма, яка функціонує як сторінка налаштувань. Коли елементи форми модифікуються, вони позначаються як unsavedі мають інший колір меж. Коли форму збережено, вони позначаються як збережені, маючи інший колір меж. Я хочу, щоб при збереженні форми межа поступово зникала. Замовлення піде: <input type='text' class='unsaved' /> Not saved yet, …

79 css  css-transitions 

Я зашифрував сценарій (за допомогою користувача тут), який дозволяє мені розширити вибраний div і змусити інші діви відповідно поводитись однаково, розтягуючи рівномірно, щоб підходити до залишків місця (крім першого, ширина якого фіксована). А ось картина того, чого я хочу досягти: Для цього я використовую флекс та переходи. Він працює добре, …

9 javascript  jquery  css  flexbox  css-transitions