replaceBoxController.replaceを呼び出すことでボックス内を切り替えることができます。
ここではreplaceBoxクラス要素自体をクリックすることで実行します。
引数は以下となります。
replace(置換要素, {
duration : 処理時間(ms)。デフォルト=400ms
easing : animate関数と同様。
jQuery.easingと同じ引数を設定可能。
デフォルト=linear
completeCallback : 処理完了時に実行する関数。
引数は置換対象要素、置換要素の二つ。
置換対象要素はこの時点でDOM上から消去されているため、
保存する場合はここで行う。
transition : 切替効果指定。
後述のreplaceBoxController._transition
配下のメンバー名か、切替効果用関数。
デフォルト=slideLeft
});
また、処理完了時にrootElementでreplaceBoxCompleteイベントを発生させています。
引数のcontext.evArgのメンバは以下の通りです。
- old : 置換対象要素
- current : 置換要素
ここではtransitionCompleteを捕捉して置換要素の文字サイズを変更させています。