3

私はjCarouselでcufonを使用しています。

カルーセルには5つのアイテムがあり、右から左に回転します。つまり、画面から左に移動します。ここで見ることができます。

http://www.foursquare.org/site/test

カルーセルをデフォルトの動作のままにすると、カルーセルは5番目のスライドに到達し、次に右にすばやくスライドして戻り、すべてが正しく表示されます。

カルーセルを「円形」に設定すると、最初の回転後にcufonの見出しが消えます。つまり、最初のスライドが最後のスライドの右側に追加されたときに、スライドの残りの部分には付属していません。

この状況で見出しが消えないように、jCarouselとCufonに協力またはコミュニケーションをとらせるために、私に何ができるか知っていますか？

TTFNトラビス

4

5 に答える 5

2

jcarouselを自動的に回転させる場合は、Cufon.Refresh（）をアニメーション関数にアタッチする必要があります。

カルーセルでは、jcarouselで「itemVisibleOutCallback」パラメーターを使用し、「onAfterAnimation」呼び出しにCufon.Refresh（）をアタッチしました。

次に例を示します。

jQuery('#myCarousel').jcarousel({
        scroll: 1,
        wrap: 'circular',
        animation: 1500,
        auto: 7,
        itemVisibleOutCallback: {
            onBeforeAnimation: carouselAnimateStart
        }
    });

function carouselAnimateStart(){
    Cufon.refresh();
}

アレックス

于 2011-06-29T10:51:42.240 に答える
1

coda-slider のバリエーションでこの問題に遭遇しました。使用する代わりに、私にとってうまくいくように見えたもの

visibility:hidden

使った

display:none

と

display:block

明らかにする。

于 2011-01-21T22:48:18.260 に答える
0

アレックスには良いアイデアがありましたが、itemVisibleOutCallback ごとにすべての cufon オブジェクトを更新することはできません。これがあなたに与えるものはスローダウンです。

もう一度考えてみてください。「次へ」ボタンをクリックすると、ページの読み込み時に変換されたすべての要素が Cufon によって更新されます。ブラウザによっては、問題が発生する可能性があります。

したがって、適切な解決策は、特定の要素のみを置き換えることです。次のようにできます。

$("#carousel").jcarousel({
    itemVisibleOutCallback: {
        onBeforeAnimation: function() {
            Cufon.replace("#carousel h2, #carousel li > div > a", {fontFamily: 'YourFont', hover: true});
        }
    }
});
于 2012-05-28T14:06:57.300 に答える
0

jCarousel liteでは、次のコードを使用します。

beforeStart: function() {

    Cufon.refresh();

},
afterEnd: function() {

    Cufon.refresh();            

}

今はうまくいっているようですが、まだ Mac 上の Firefox でしかテストしていません。しかし、あなたの投稿をありがとう。それは私を助けました、そしてこれが他の誰かを助けることを願っています.

乾杯、マイケル。

于 2011-07-11T09:54:25.110 に答える
0

私がやったのは、カルーセルが次のアイテムに移動するたびに、関連するテキストの cufon を再レンダリングするように Cufon.replace 関数を呼び出すことでした。

IE 

$(document).ready(function(){
  $j('.jcarousel-prev').click(function(e){
    Cufon.replace('li.jcarousel-item h3');
  });
  $j('.jcarousel-next').click(function(e){
    Cufon.replace('li.jcarousel-item h3');
  });
});

ただし、IEのjCarouselには、上記のjQueryコードを使用するかどうかにかかわらず、非表示のカルーセルアイテムにcufonを二重に書き込むように見えるという独自の問題があります。誰かがこの問題に遭遇して修正した場合、それは非常に役に立ちます。事前に修正を見つけたら、ここに投稿します:)

于 2010-12-01T15:51:22.693 に答える