ホームページ  >  に質問  >  本文

javascript - js を使用してトランジション効果を作成するにはどうすればよいですか?

Xiaobai は js にあまり詳しくないので、js を使用してボタンをクリックし、5 秒後に p が右側の 500px の位置に移動した場合、どのような考えになりますか?この効果を生み出しますか?

これらすべての効果を実現するには、まずクラスを作成してから、js を使用して className を切り替える必要がありますか?

しかし、クリック イベントでは、すべての CSS 効果を記述しますか? QUQ

滿天的星座滿天的星座2672日前907

全員に返信(6)返信します

  • PHP中文网

    PHP中文网2017-06-26 10:56:58

    リーリー

    簡単なデモを紹介しますので、これは方法の 1 つにすぎず、他にもたくさんあることがわかるでしょう。

    返事
    0
  • 伊谢尔伦

    伊谢尔伦2017-06-26 10:56:58

    これが欲しいものですか?以下のコードを参照してください。p は 5 秒で 500px に移動します。まず p にトランジション効果を設定し、右側に移動するクラスを追加します。

    追記: これは単なるデモコードであり、互換性などは考慮されていません...

    css3

    リーリー リーリー リーリー

    返事
    0
  • 女神的闺蜜爱上我

    女神的闺蜜爱上我2017-06-26 10:56:58

    CSSを使用することも、jsで直接記述することもできます。 cssの場合はtransitionを使って記述します。特にBaiduの場合はクリックイベントが発生した際に要素にクラスを追加してスタイルを変更します。 jsの場合は、settimeoutを使用し、例として挙げた左マージンを取り、左マージンを少しずつ変更し、指定された値(cleartimeout)に達したら停止します

    返事
    0
  • 代言

    代言2017-06-26 10:56:58

    上記の通り、ie9以下の場合はタイマーを使用する必要があります

    リーリー

    返事
    0
  • 習慣沉默

    習慣沉默2017-06-26 10:56:58

    通常は css3 が使用されますtransition实现过渡效果,要动画的话用animation。js を使用するとパフォーマンスに負荷がかかります。以下にいくつかの参考記事を示します。

    返事
    0
  • typecho

    typecho2017-06-26 10:56:58

    css3d プロパティ

    返事
    0
  • キャンセル返事