この記事では、主に JS モーション特殊効果のチェーン モーションを紹介し、JavaScript チェーン モーションの原理と具体的な実装テクニックをサンプルの形式で分析します。必要な友達は参考にしてください。
この記事では、JS モーションのチェーン モーションについて説明します。特殊効果と例。参考のために皆さんと共有してください。詳細は次のとおりです。
前の記事「JS モーションエフェクトに任意の値のモーションを追加する方法」に従って、引き続き
チェーンモーションを投げます。一つ一つの動き。たとえば、マウスを p に移動すると、まず幅が拡大され、次に高さが拡大され、次に透明度が変更されるなど、一連の動きが連続して実行されます。早速、栗の話にいきましょう! !
マウスが p に移動すると、p は最初に幅が広くなり、次に高くなり、外に移動すると 1 つずつ元の状態に戻ります。前の記事の startMove ()
を変更する必要があります。この関数は引き続き改良されています
function startMove(obj,attr,iTarget,fn)
をもう 1 つ渡します startMove()
函数继续做改进
function startMove(obj,attr,iTarget,fn)
fnパラメータは、動作が終了したら、次の動作を継続することを意味します、次の動作があれば、次の動作を実行し、そうでない場合は、下方向に実行し続けます。完全なテストコード:
if(fn){ fn(); }
<body> <p id="p1"></p> </body>
<style> #p1{ width: 200px;height: 200px; background: green; } </style>
vue-cliプロジェクトにおけるProxyTableのクロスドメインの問題
jest を使用してネイティブコンポーネントに反応するテストの詳細な説明
以上がJSでのチェーンの動き(詳細チュートリアル)の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。