sliderは非常に複雑な処理で演出を実現しているため連打に対応していません。そのため連打された場合は処理を無視し、結果として前回最後に説明した問題(carouFredSelを連続的に操作するとサムネイルとnivoの画像がずれる問題)につながります。sliderの演出中はcarouFredSelの処理も無視する方法で問題を回避したいと思います。sliderが演出中はcarouFredSelの操作をロックするようにします。ロックのタイミングを確認しましょう。sliderの処理が以下の様に変更されているのを確認して下さい。function(){$("#debug").text("")}beforeChangeプロパティに設定した処理は、演出を開始する前に実行されます。afterChangeプロパティに設定した処理は、演出が完了した後で実行されます。textメソッドを利用してdebugクラスの要素に「LOCK」と表示したり、消したりするだけにしています。表示するdebugクラスの要素はbody内の最後の部分に以下の様に設定されています。id="debug"></div>つまりこの処理によって、nivoの演出を開始する前に「LOCK」と表示して、nivoの演出が完了すると「LOCK」の表示を削除します。このタイミングでcarouFredSelをロックするわけです。今回はcarouFredSelのロックにフラグを利用します。sliderのコールバックの処理が以下の様に変更されているのを確認して下さい。false;//---フラグの設定$("#debug").text("unlock")}ロックするタイミングでフラグ「nivo_lock_flg」をtureに設定し、ロックを解除するタイミングでフラグ「nivo_lock_flg」をfalseにしています。jQueryの最初の部分にフラグ「nivo_lock_flg」が作成されていることも確認して下さい。最初はロックされていないので値としてfalseを設定しておきます。false;これでcarouFredSelをロックする準備が整いました。フラグ「nivo_lock_flg」がtrueの時にはcarouFredSelの操作を無視する様にし、falseの時だけ処理するようにします。サムネイルのロックcarouFredSelの処理はサムネイルをクリックした時と、next/prevボタンをクリックした時の2つがあります。サムネイルをロックする処理の方が簡単なので先に説明します。サンプル(fred11/03.html)を開いてサムネイルをクリックする部分の処理(jQueryの最後)に以下の様なif文が追加されていることを確認して下さい。既存の処理(4,5行目)に変更はありません。-3;$(".carouPage>a").eq(myID).trigger("click");}});このif文でフラグ「nivo_lock_flg」がfalseの時にしか、サムネイルをクリックした時の処理を実行しないようにしています。sliderの演出中は処理が無視されるため、サムネイルとnivoの画像がずれる問題は発生しなくなります。next/prevボタンのロックnext/prevボタンはcarouFredSel内で処理が実行されているため、サムネイルのようにはロックできません。そこでダミーのnext/prevボタンを用意して、それを中継するようにします。サンプル(fred11/04.html)を開いてbody内にnext2/prev2ボタンが追加されていることを確認して下さい。この追加したボタンを本当のボタンとして、これまでのボタンをダミーとします。class="carouNext2">next</div>この追加したものをcarouFredSelのボタンとして利用します。jQueryのnext/prevボタン設定が以下の様に変更されているのを確認して下さい。".carouNext2";この変更のため、既存のnext/prevボタンをクリックしても機能しません。追加したボタン(nextやprevといった文字だけ)をクリックすると機能します。これで下準備が完成です。triggerメソッドを利用してnext2/prev2ボタンをクリックするようにします。サンプル(fred11/05.html)を開いてjQueryの最後に以下の処理が追加されていることを確認して下さい。false){$(".carouPrev2").trigger("click");}});1行目では既存のnextボタンのクリック時の処理を設定しています。主な内容は3行目でtriggerメソッドを利用して本当のnextボタン(carouNext2)をクリックすることなのですが、ここでサムネイルのロックで利用したif文のテクニックを追加しています。そのためnivoの演出中には処理が無視されるわけです。6行目からのprevボタンの処理も同じ考え方で作成されています。実際に既存のnext/prevボタン(文字ではない方のボタン)を連打して下さい。前回までのサンプルと異なり、サムネイルとnivoの画像はずれないはずです。あとは確認用の仕組みを削除して完成です。サンプル(fred11/06.html)を開いてbody内の最後に追加されていたid属性がdebugの要素が削除されていることを確認して下さい。追加したnext2/prev2ボタンは以下の様にテキストを削除して表示しないようにしました。sliderの設定でid属性がdebugの要素に「LOCK」と表示する部分を削除して、以下の様にフラグの設定だけにしました。false;}これでcarouFredSelを連打した時にサムネイルと画像がずれる問題を解決できました。sloderだけでなくcarouFredSelも演出中は処理を無視するようになっています。演出が「短時間の移動」だけなので気が付かないだけです。sliderは演出が複雑なので処理を無視しないようにする設定はないのですが、carouFredSelは演出がシンプルなので処理を無視しないように設定できます。利用することはないと思いますが紹介します。サンプル(fred11/test01.html)を開いてソースを確認して下さい。これはカルーセルとnivo(2)で最後に完成させたfred09/04.htmlとほとんど同じなのですが、jQueryに以下の処理が追加されています。(data){$(data.items.visible[3]).addClass("nowCenter");}}carouFredSelのscrollプロパティ内にあるqueueプロパティをtrueに設定すると、演出中の処理を無視しないでアニメのキューに追加するようになります。実際にサンプル(fred11/test01.html)でnextボタンを連打してみてください、クリックした回数と同じだけ律儀に移動するはずです。そのためボタンの連打を停止してもしばらく演出が続くこととなり、利用者は「壊れた」と勘違いしがちです。そのためqueueプロパティはデフォルトでfalseとなっています。これでcarouFredSelの説明は全て完了となります。