< AngularJS

AngularJS animáció

Egy

<!DOCTYPE html> <html ng-app="myApp"> <head> <title>AngularJS ngHide példa</title> <style> /* ngHide animation */ .doboz { padding: 10px; background-color: orange; } .doboz.ng-hide-add { transition: all linear 0.8s; opacity: 1; } .doboz.ng-hide-add-active { opacity: 0; } .doboz.ng-hide-remove { transition: all linear 0.8s; opacity: 0; } .doboz.ng-hide-remove-active { opacity: 1; } </style> </head> <body> <h1>ngHide animáció</h1> <button ng-click="disabled = !disabled"> Mehet </button> <div ng-hide="disabled" class="doboz"> Ennek az elemnek van ng-hide direktívája. </div> <script src="https://code.angularjs.org/1.8.2/angular.js"></script> <script src="https://code.angularjs.org/1.8.2/angular-animate.js"></script> <script> var app = angular.module('myApp', ['ngAnimate']); </script> </body> </html>