我的问题很简单,但我无法弄清楚它的来源.
我有一个按钮.当我点击它时,它会向左滑动,另一个按钮取代它,并带有CSS动画.
这是我的代码:
.form-anim-right-click {
position: relative;
overflow: hidden;
}
.form-anim-right-click > .form-group {
width: 200%;
}
.form-anim-right-click > .form-group > .btn {
width: 50%;
display: inline-block;
float: left;
-o-transition: transform 0.3s ease-out;
-webkit-transition: transform 0.3s ease-out;
transition: transform 0.3s ease-out;
}
.form-anim-right-click > .form-group > .btn:focus {
-o-transform: translate(-100%, 0);
-webkit-transform: translate(-100%, 0);
-ms-transform: translate(-100%, 0);
transform: translate(-100%, 0);
}
.form-anim-right-click > .form-group > .btn:focus + .form-slide {
-o-transform: translate(-100%, 0);
-webkit-transform: translate(-100%, 0);
-ms-transform: translate(-100%, 0);
transform: translate(-100%, …Run Code Online (Sandbox Code Playgroud)我正在使用 Angular CLI 11.0.2 开发一个角度应用程序,并在应用程序中使用HammerJS来处理滑动事件。
当我编译应用程序时,出现以下警告消息:
Warning: F:\Programs\GoodRiddles\git\angular\src\app\config\hammerjs.config.ts depends on 'hammerjs'. CommonJS or AMD dependencies can cause optimization bailouts.
For more info see: https://angular.io/guide/build#configuring-commonjs-dependencies
Run Code Online (Sandbox Code Playgroud)
根据我在这里的理解,我应该用 ECMA 版本的库替换 HammerJS。
我的问题是: 是否有正确的方法(而不是简单地隐藏消息)来修复它?我需要使用另一个库吗?
如果它可以帮助,这就是我使用它的方式:
import { Injectable } from '@angular/core';
import { HammerGestureConfig } from "@angular/platform-browser";
import * as hammer from "hammerjs";
@Injectable()
export class HammerConfig extends HammerGestureConfig {
overrides = <any>{
swipe: { direction: hammer.DIRECTION_HORIZONTAL },
pinch: { enable: false },
rotate: { enable: false }
};
}
Run Code Online (Sandbox Code Playgroud)