Questions tagged transition

Explore the latest questions and answers asked by our top developers.

How can i program my angular animation with dynamic values?

I have a page transition animation in angular between the home and the models page. Both page have a button, button my-button-start-page on the home page, my-button-end-page on the models page. I would like to move the my-button-start-page to the my-button-end-page’s location during the transition. Is it even possible like how i tried in the […]

By Bezonce
Published
Categorized as angular, animation, transition Tagged , ,

Transition between *ngIf with Ionic v5

How can I make a fade transition between 2 elements with *ngIf? // my.component.html <ion-toolbar class="toolbar" *ngIf="!showSearchbar"> <ion-buttons slot="start"> <ion-back-button *ngIf="canGoBack"></ion-back-button> <ion-menu-button *ngIf="!canGoBack"></ion-menu-button> </ion-buttons> <ion-buttons slot="primary"> <ion-button (click)="showSearch()"> <ion-icon slot="icon-only" ios="search" md="search-sharp"></ion-icon> </ion-button> </ion-buttons> <ion-title>{{‘lbl_client_search2’ | getlabel}}</ion-title> </ion-toolbar> <ion-toolbar class="toolbar" *ngIf="showSearchbar"> <ion-buttons slot="start"> <ion-button (click)="showSearch(false)"> <ion-icon slot="icon-only" name="arrow-back"></ion-icon> </ion-button> </ion-buttons> <ion-input #searchInput autofocus debounce="1000" inputmode="search" […]

How to destroy angularjs directive?

I have a AngularJS directive that I’ve inserted on the form of my SPA application. What it does is that it checks if the form is dirty before transitioning to a new state. Here is the code below. app.directive(‘leavepage’, [‘$transitions’, ‘$uibModal’, ‘$q’, function ($transitions, $modal, $q) { return { restrict: ‘A’, require: ‘^form’, link: function […]

Angular elastic enter height animation

I’m new to Angular Animations and am needing to implement the below animation on a list and its items. My desired outcome of the animation is as follows: I’ve read the documentation and the closest I’ve been able to piece together is the following: export const items = trigger(‘items’, [ transition(‘:enter’, [ style({ ‘max-height’: ‘1px’ […]

Smooth color change with a slider Angular

What I am trying to achieve is different background color depending on slider value. The slider looks something like this: <mat-slider id="slider" #sldr max="100" min="0" step="10"></mat-slider> And the element I’m changing like this: <div class="area" [ngClass]="{‘red’: sldr.value <= 20, ‘orange’: sldr.value <= 40 && sldr.value > 21, ‘yellow’: sldr.value <= 60 && sldr.value > 41, […]

By Kateryna
Published
Categorized as angular, css, mat-slider, slider, transition Tagged , , , ,

Still Have Questions?


Our dedicated development team is here for you!

We can help you find answers to your question for as low as 5$.

Contact Us
faq