ホームページ >ウェブフロントエンド >jsチュートリアル >JavaScript 45 イージング効果、非常にクールな JavaScript スキル

JavaScript 45 イージング効果、非常にクールな JavaScript スキル

WBOYオリジナル: 2016-05-16 18:05:181138ブラウズ

参数	类型	说明
el	element	必需，为页面元素
begin	number	必需，开始的位置
change	number	必需，要移动的距离
duration	number	可选，缓动效果持续时间，默认是500ms。建议取300~1000ms。
field	string	必需，要发生变化的样式属性。请在top，left，bottom,right，width与height中选择。
ftp	number	可选，每秒进行多少帧动画，默认50帧，保证流畅播放。一些参考资料，日本动画1秒36帧，中国卡通24帧，赛车游戏60帧。
ease	function	必需，缓动公式，参数为0~1之间的数。可参考我下面给出的45条公式。
onStart	function	可选，在开始时执行。
onEnd	function	可选，在结束时执行。

プロトタイプジャンルのイージング式はパラメーターが1つだけ（45種類に増加）

<div class="taxiway">
<div class="move" onclick="transition(this,{field:'left',begin:parseFloat(getCoords(this).left),change:700,ease:tween.bouncePast})">
</div>
</div>
<div class="taxiway">
<div class="move" onclick="transition(this,{field:'width',begin:parseFloat(getStyle(this,'width')),change:300,ease:tween.spring})">
</div>
</div>
<span class="clear">
</span><h2>
</h2>下の表のグリッドをクリックしてください<div id="transition" class="transition">
</div>

[Ctrl A すべて選択注: 外部 Js を導入する必要がある場合は、

を実行するために更新する必要があります]

声明：

この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。

前の記事：Select_jqueryのjQuery操作メモ記録次の記事：Select_jqueryのjQuery操作メモ記録

続きを見る

JavaScript 45 イージング効果、非常にクールな JavaScript スキル

関連記事