1

jQueryWebサイトのEasing関数について読んでいます。私の意図する目標は、フォームが送信されたときに発生するDiv調整をスムーズにすることです。

JFiddle - http: //jsfiddle.net/9qbfF/
Sandbox - http ://itsmontoya.com/work/playdeadcult/index.php
フォームをテストして、前述のDiv調整を確認してください。test@test.comを使用してください

ご覧のとおり、現在、POSTが成功するとDivがスナップして配置されます。スイングイージング効果を使って、より快適な体験をしたいと思っています。

イージングの実装をいじって、完全に台無しになっているように感じました。私はテストコードを取り出したので、誰かが私を助けてくれるよりクリーンな環境でした:)。

私は助けに感謝します!

4

1 に答える 1

3

私が正しく理解していれば、おそらくこれを置き換えたいと思うでしょう:

$('#myForm').ajaxForm(function() { 
  document.getElementById('formFill').style.visibility = 'hidden';
  document.getElementById('joinDiv').style.width = '842px';
  $("#joinText").html( 'Thank you for signing up!');
}); 

これとともに:

$('#myForm').ajaxForm(function() { 
  document.getElementById('formFill').style.visibility = 'hidden';
  $("#joinText").html( 'Thank you for signing up!');
  $('#joinDiv').animate({width: '842px'}, 1000, 'swing');
});

の最初のパラメータanimateは、アニメーションを終了する「終了状態」を説明するハッシュです。joinDivは649pxか何かのように見えるので、animate呼び出しは1秒の間に649から842に増加します(1000ms、2番目のパラメーター)。これは、この種の移行には少し時間がかかりますが、1000を少し少なくすることで、簡単に微調整できます。3番目のパラメーターはイージング機能です。アニメーションの完了後にコールバック関数を使用して何かを実行するオプションの4番目のパラメーターがあります。

最初のパラメーターには、さらに多くのものを含めることができます。たとえば、{width: '842px', height: '200px', opacity: '0.0'}不透明度が80%の開始値から完全に透明になるまで、すべて同時にスムーズにフェードしながら、高さと幅が大きくなる可能性があります。

于 2011-08-23T01:23:59.937 に答える