Популярные вопросы по тегу ANIMATION

Как синхронизировать CSS-анимацию между несколькими элементами?

... 7 вопрос: можно ли синхронизировать (чтобы 6 оба элемента достигли своей вершины одновременно 5 и т. д.) анимацию для обоих элементов независимо 4 от того, когда запущена анимация 2-го элемента? Вот 3 мой HTML: <div id="bouncy01">Drip</div> <div id="bouncy02">droP</div> и мой CSS: @-webkit-keyframes bounce { 0% {-webkit-transform: translateY(0px);} 25% {-webkit-transform: trans ...

Отключить анимацию мата-степпера при переходе

... отключить анимацию элемента 2 управления mat-stepper мате ...

Ожидание / загрузка прозрачной анимации GIF / APNG

... г фигур, которые я нашел на: http://www.ajaxload.info/ http://www.loadinfo.net/ http://www.ajaxload.info/ http ...

Анимация перехода css не работает при изменении атрибута "d" пути svg

... е содержит дополнительную информацию 2 об анимации строки или пути svg ... и кажется, что 1 это пока невозможно с переходом css ... ...

Электронная анимация загрузки

... нимацию загрузки для моего приложения Electron? Я 3 изучаю эту новую технологию, и было бы неплохо 2 понять, как это сделать правильно. Я думаю 1 о чем-то вроде: app.on('ready ...

Перемещение мячей в Tkinter Canvas

... , но не 7 могу заставить двигаться второй мяч; еще 6 один связанный с этим вопрос - некоторые 5 люди используют метод move(object) для достижения этой 4 цели, в то время как другие используют delete(object), а 3 затем перерисовывают его. Какой из них использовать 2 и почему? Это мой код, который анимирует 1 / перемещает только один мяч: from Tkinter import * class Ball: def __init__(self, canva ...

Реверс анимации

... нии в макет. Когда 3 он будет удален, я хочу отменить ту же анимацию. Есть 2 ли способ отменит ...

onAnimationEnd не вызывается, onAnimationStart работает нормально

... ую содержимое ScrollView с помощью 7 TranslateAnimation. При запуске анимации 6 вызывается прослушиватель onAnimationStart, но 5 onAnimationEnd не вызывается. Есть идеи? Макет: <?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:background="@drawable/popup_window_bg" andro ...

Можете ли вы изменить атрибуты ключевых кадров анимации CSS3 в строке (то есть в атрибуте стиля HTML)?

... width:50%; } } Можно ли изменить атрибут ширины 6 в части ключевого кадра «на», выполнив что-то 5 вроде <div id="someID" style="change keyframe here"> В настоящее время я просто динамически 4 создаю всю таблицу стилей на странице, чтобы 3 настроить кл ...

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

... ьзователям, а 38 их значения немного более интуитивно понятны 37 и предсказуемы. Углы Эйлера усложняются на 36 уровне кода - они требуют сохранения порядка 35 поворота, и составление практической ориентации 34 (будь то матрица или кватернион) с использованием 33 этого порядка и связанных углов, мягко говоря, обременительно. Надежные 32 интерполяции удобнее всего выполнять с ис ...

Используйте @HostBindings вместо host в angular 4

... { Component, OnInit, HostBinding } from '@angular/core'; import { AngularFire, AuthProviders, AuthMethods } from 'angularfire2'; import { Router } from '@angular/router'; import { moveIn } from '../router.animations'; @Component({ selector: 'app-login', templateUrl: './login.component.html', styleUrls: ['./login.component.css'], animations: [moveIn()], host: {'[ ...

Обновление значений оси x с помощью анимации matplotlib

... 19 только значения времени от 0 до 24, а затем 18 повторяется до 100. Прекрасный пример - here. Ссылка 17 использует FuncAnimation и обновляет метки оси x непрерывно, используя 16 plot().axes.set_xlim() и увеличивая значения x. Код доступен по 15 ссылке под видео YouTube по предоставленной 14 ссылке. Я добавил ниже код, который показывает 13 мои попытки воспр ...

CSS-анимация onClick

... webkit-animation-fill-mode: forwards; } @-webkit-keyframes cssAnimation { from { -webkit-transform: rotate(0deg) scale(1) skew(0deg) translate(100px); } to { -webkit-transform: rotate(0deg) scale(2) skew(0deg) translate(100px); } } Как я могу ...

Как анимировать ширину и высоту UIView в Xcode?

... t animations:^ { NSLog(@"yourview : %@",customView); customView.frame = CGRectMake(self.view.frame.origin.x +5, self.view.frame.origin.y +5, 310, 150); NSLog(@"yourview : %@",customView); }completion:^(BOOL finished) { }]; Что по-прежнему не работает. Я 5 вижу следующие возможные проблемы: Я загружаю этот customVi ...

Получить масштаб и угол поворота из CGAffineTransform?

... олучить масштабный коэффициент и 2 угол поворота формы представлени ...

WPF Animation: как заставить ее скользить?

... ransformButton"> <DoubleAnimation Storyboard.TargetName="btnChange" Storyboard.TargetProperty="(Button.RenderTransform).(TranslateTransform.X)" By="130" Duration=&q ...

Как иметь несколько переходов CSS для элемента?

... -moz-transition: color .2s linear; -o-transition: color .2s linear; transition: color .2s linear; -webkit-transition: text-shadow .2s linear; -moz-transition: text-shadow .2s linear; -o-transition: text-shadow .2s linear; transition: text-shadow .2s linear; } .nav a:hover { color:#F7931E; text-shadow: 0 1.5em 0 rgba(247, 147, 30, 0.15); } Как видите, свойства 5 перехода перезаписываю ...

CSS3 фильтр размытия анимации ключевых кадров

... жение. Что-то 3 вроде настройки фокуса на камеру. (сфокусировано-размыто-сфокусировано). Вот 2 что у меня получилось: @-webkit-keyframes image_blur { 0% { -webkit-filter: blur(0px);} 50%; { -webkit-filter: blur(5px);} 100% { -webkit-filter: blur ...

Как сделать анимацию с помощью CSS в JavaFX?

... Button button = new Button(); button.getStyleClass().add("class1") button.setOnMouseClicked(new EventHandler<MouseEvent>() { @Override public void handle(MouseEvent mouseEvent) { ...

Слайд-вниз и слайд-макет с анимацией

... центре с помощью 3 slideUp, когда я нажимаю кнопку и снова 2 нажимаю, чтобы скрыт ...

Остановить AnimatorSet из ObjectAnimators в Android

... и очистить эту анимацию 2 из ImageView, когда кнопка нажата как btn.clearAnimation(), очевидно 1 не работае ...

Uncaught TypeError: требуется 1 аргумент, но присутствует только 0 ... Но моя функция не принимает аргументов?

... ment': требуется 2 1 аргумент, но присутствует только 0. Что 1 мне не хватает? var container = document.getElementById('container'); var box1 = document.getElementById('box1'); var containerWidth = container.clientWidth; var box1Width = box1.clientWidth; function animate() { box1.style.left = '0px'; setTimeout ...

Реализация переходов в BottomSheet

... t; with SingleTickerProviderStateMixin { AnimationController _controller; Animation<double> opacityAnimation; int i = 0; @override void initState() { super.initState(); _controller = AnimationController(vsync: this, duration: Duration(milliseconds: 500)); opacityAnimation = CurvedAnimation( parent: Tween<doubl ...

Как отключить неявную анимацию CALayer?

... хочу их нарисовать. Для 6 этого я создаю CGImageRef и помещаю его в contents слоя. Но 5 он анимированный, и я этого не хочу. Все 4 перепробовала: removeAnimationForKey: removeAllAnimations установить словарь действий с помощью actionlayer delegate [CATransaction setDisableAnimations:YES] Это кажется правильным. Я 3 не понимаю, почему этот слой все еще ...

Остановка / запуск / пауза в анимации python matplotlib

... оторой базовой анимации. Эта 3 функция постоянно просматривает анимацию. Есть 2 ли способ при ...

Как я могу исправить эту ошибку: «ARC запрещает явную отправку сообщения о выпуске в Xcode.

... lloc] initWithObjects: [UIImage imageNamed:@"sun1"], [UIImage imageNamed:@"sun2"], nil]; fadeImage.animationImages = imageArray; fadeImage.animationDuration = 1; [imageArray release]; //==== HERE IS WHERE I GET THE ...

CSS-анимация при закрытии модального окна

... -webkit-animation-duration: 0.4s; animation-name: animatetop; animation-duration: 0.4s } /* Add Animation */ @-webkit-keyframes animatetop { from {top: -300px; opacity: 0} to {top: 0; opacity: 1} } @keyframes animatetop { from {top: -300px; opacity: 0} to {top: 0; opacity: 1} } <!-- Trigger/Open The Modal --> <button id="myBtn">Open Modal</button> <!-- The Mod ...

Отключить анимацию поворота при изменении ориентации

... ет, можно ли его ускорить? Чтобы уточнить, я 2 не хочу останавливать изменение ори ...

В чем разница между BoxBufferGeometry и BoxGeometry в Three.js?

... могу найти правильный 2 ответ о разнице между BoxBufferGeometry 1 ...

JQuery удалить класс после воспроизведения анимации CSS?

... mation:srcb ease-in .4s 1;} и просто играйте один 6 раз при входе на сайт но проблема в том, что 5 анимация завершена кнопки на м ...

Как плавно вернуть CSS-анимацию в текущее состояние?

... , который позволяет мне включать 12 и выключать анимацию для этого элемента. Сама 11 анимация очень проста: перемещает элемент 10 слева направо и обратно. Когда я останавливаю 9 анимацию, мой элемент, очевидно, возвращается 8 в исходное положение. Но он возвращается 7 внезапно, а не плавно. Таким образом, он 6 просто меняет свою позицию с той, когда 5 я отключил анимацию, на исходную. Мой вопрос: есть 4 ли способ ос ...

AnimateLayoutChanges не работает с RecyclerView

... droid:layout_width="match_parent" android:layout_height="wrap_content" android:animateLayoutChanges="true" android:orientation="vertical"> <android.support.v7.widget.RecyclerView ...

CSS - бесконечная анимация (переход к правому градиенту загрузки) мерцает

... ttps://cloudcannon.com/deconstructions/2014/11/15/facebook-content-placeholder-deconstruction.html для 17 создания фиктивного загрузчика. К сожалению, этот 16 учебник включает фиксированные значения 15 пикселей, и я хочу, чтобы он работал на 14 экранах всех размеров. поэтому я настроил 13 анимацию следующим образом: @keyframes placeHolderShimmer { 0% { background-position: -30vw 0 } 100% { background-positi ...

Как создать анимированный детерминированный круговой индикатор прогресса?

... ть что-то подобное во Flutter: Я 2 пробовал следующий код, но он нарисован 1 без анимации. Circ ...

Как применить функцию замедления анимации при просмотре в Android

... *(7.5625f*t*t) + b; } else if (t < (2/2.75f)) { return c*(7.5625f*(t-=(1.5f/2.75f))*t + .75f) + b; } else if (t < (2.5/2.75)) { return c*(7.5625f*(t-=(2.25f/2.75f))*t + .9375f) + b; } else { return c*(7.5625f*(t-=(2.625f/2.75f))*t + .984375f) + b; } } У 4 меня есть пример, в котором пользовательский 3 интерполятор используется следующим образом: Интерполятор: public class HesitateInterpolator i ...

WPF Fade Out на элементе управления

... х, удаление ...). Для видимости 26 установлено значение "Скрытый", а для стиля 25 задан стиль animateFadeOut, определенный 24 как ресурс (см. Ниже). Затем я хочу, чтобы 23 текст и элемент управления Visibility были 22 видимыми в моем коде C#, а элемент управления 21 обратной связью отображал сообщение и исчезал 20 через 5 секунд и оставался скрытым (Visibility.Hidden). Следующий 19 код XAML работает при п ...

Анимация масштаба Android на просмотре

... пользовать ScaleAnimation (программно 7 не в xml), чтобы изменить высоту для просмотра 6 от 0 до 60% родительской высоты. Ширина 5 обзора постоянна и составляет 50 пикселей. Вид 4 пуст, установлен только цвет фона. Может 3 ли кто-нибудь дать мне код для scaleAnim с использованием 2 ScaleAnimation из к ...

Angular 2/4 Анимация по высоте div

... style({height:0})) ]) ]) Изменение 13 высоты на ширину / непрозрачность, и анимация 12 отлично работает ... кто-нибудь знает, в 11 чем проблема? нигде не нашел относительного 10 ответа. пример того, чего я пытаюсь достичь, похож 9 на анимацию в udemy, при нажатии на раздел 8 высота div расширяет отображение всех видео 7 - https://www.udemy.com/meteor-react/ Спасибо за внимание. Обновить - по-прежнему не 6 работает ... Может быт ...

CSS-анимация с постепенным переходом на плавный слайдер

... сменой слайда - кажется, изображение возвращается 3 в исходное состояние. На самом деле мне 2 нужен плавный переход. Есть идеи, как исправить? См. пример 1 на Code Pen: https://codepen.io/katundu/pen/aJJqWv JS $('.slider').slick({ draggable: true, autoplay: true, autoplaySpeed: 7000, arrows: false, dots: true, fade: true, speed: 500, infinite: true, ...

Плавная прокрутка к определенному элементу на странице

... . <h2 id="idElement3">Element3</h2> content.... <h2 id="idElement4">Element4</h2> content.... Сейчас он работает, но не может 3 сделать его более гладким. Я использовал 2 этот код, но не могу заставить его работать. $('html, body').animate({ scrollTop: $("#elementID").offset().top }, ...

Свойство TargetName не может быть установлено в установщике стилей, так как же оно устанавливается?

... ight="5" Fill="Black" /> <Path Name="mouth" Stroke="Blue" StrokeThickness="4" Data="M 35,75 Q 55,90 80,75 " /> </Canvas> <Grid Margin="100,5,0,0" Width="75" Height="300"> <Canvas> <Ellipse Height="40" Width="40" ...

Как добиться эффекта моргания в svg?

... ,485.421c-0.813,4.715-1.888,9.404-2.351,14.153c-0.34,3.49-2.639,4.195-4.724,3.059 c-2.714-1.479-5.705-3.691-6.968-6.352c-3.524-7.421-6.233-15.231-9.236-22.897c-2.169-5.538-1.751-6.154,4.18-6.392 C1008.343,466.518,1015. ...

React Native - уменьшение ширины анимации

... Native 12 у меня есть условный значок и Searchbar. static navigationOptions = ({ navigation }) => { const { params = {} } = navigation.state; return { headerTitle: ( <View style={{ flex: 1, backgroundColor: Platform.OS === 'ios' ? '#e54b4d' : '', alignItems: 'center', flexDirection: 'row', paddingHorizontal: 10, height: StatusBar.currentHeight, }}> {params.is ...

Анимация гифки при наведении

... этот код. У меня 10 есть плагин jquery, но где мне поместить 9 код (не плагин; код, который был в ответе 8 Гуффа)? Как использовать его по отношению 7 к изображениям? Есть ли функция, которую 6 я должен вызвать, чтобы заставить ее работать? Если 5 да, как лучше всего это назвать? Извините 4 за вопрос, на который уже был дан ответ, но 3 его ответ был недостаточно конкретным, и 2 я не мог прокомментиро ...

SVG, анимировать линию от x1, y1 до x2, y2?

... te attributeName="y2" attributeType="XML" from="216" to="170.999808" begin="0ms" dur="117ms" /> </line> <line x1="219.9375" y1="170.999808" x2="219.9375" y2="170.999808" style="stroke:rgb(0,0,0);stroke-width:1;" > <animate attributeName="x2" attribut ...

Android рисует анимированную линию

... оль пути. Вот в основном то, что я сделал 9 до сих пор PathMeasure pm = new PathMeasure(myPath, false); float position = 0; float end = pm.getLength(); float[] coord = {0,0,0,0,0,0,0,0,0}; while (position < end){ Matrix m = new Matrix(); // put the current path position coordinates into the matrix pm.getMatrix(position, m, PathMeasure.POSITION_MATRIX_FLAG | PathMeasure.TANGENT_MATRIX_FLAG); ...

Android: развернуть / свернуть анимацию

... on(float interpolatedTime, Transformation t) { final int newHeight = (int)(initialHeight * interpolatedTime); v.getLayoutParams().height = newHeight; v.requestLayout(); } @Override public void initialize(int width, int height, int parentWidth, int parentHeight) { super.initia ...

Как запустить две анимации jQuery одновременно?

... ons. Мне нужно сделать что-то 4 вроде этого ... $('#first').animate({ width: 200 }, 200); $('#second').animate({ width: 600 }, 200); но запускать эти два одновременно. Единственное, что 3 я мог придумать, - это испол ...

Анимация изображений в HTML5 и на холсте

... этим? после 4 часов поиска 4 в Google все, что я мог сделать, это <script type = "Text/JavaScript"> function Animate(){ var canvas=document.getElementById("myCanvas"); var ctx=canvas.getContext("2d"); var img = new Image(); img.onload = function () { ctx.drawImage(img,20,20,300,300); }; ...

Изменения видимых свойств QML-анимации

... вал это states: State { name: "iconOff" when: iconOnSwitch.checked == false PropertyChanges { target: selectIconRow; visible: false } } transitions: Transition { reversible: true from: "" ...