0

cssアニメーションをプログラムで定義して開始する方法はありますか? ある絶対位置から別の絶対位置に div をアニメーション化したいと思います。何かのようなもの：

FlowPanel fp = new FlowPanel();
fp.getElement().getStyle().setPosition(Position.ABSOLUTE);
fp.getElement().getStyle().setLeft(50, Style.Unit.PX);
fp.getElement().getStyle().setTop(50, Style.Unit.PX);

...

// something like:
fp.setAnimation("top: 300px");

css ファイルで css アニメーションを定義できることがわかりました。div のスタイルの名前を変更すると、アニメーションがトリガーされます。しかし、css で定義されたアニメーションをプログラムで変更できるかどうかはわかりません。例えば：

// css file
.testAnimation {
  top: 500px;
  transition-property: top;
  transition-duration: 1s;
}

...

// But we can't modify the "top" attribute here depending on runtime needs?:
fp.setStyleName("testAnimation"); // I may want "top" to be some other value here.

ありがとう

4

2 に答える 2

0

を使用getElement().getStyle().setProperty( property, value )して、任意のcssプロパティを設定できます。しかし、これは正しい方法ではありません。推奨される方法は、cssを介して行うことです。

このリンクはあなたを助けるかもしれません

于 2013-01-10T03:21:40.770 に答える
0

いくつかのアプローチがあります

1) GWT アニメーション - http://gwt.googleusercontent.com/samples/Showcase/Showcase.html#!CwAnimation

2) Jquery アプローチ - GWTQuery 経由 - https://groups.google.com/forum/?fromgroups=#!topic/google-web-toolkit/6kOSm0HBP4A

3) JSNI In GWT - CSS AnimationEnd イベント ハンドラを GWT ウィジェットに追加する方法

于 2013-01-10T03:34:23.907 に答える