/ / jcarouselでコールバックを使用してスライド内にテキストアニメーションを配置する方法 - jquery、アニメーション、jcarousel

jcarouselでコールバックを使用してスライド内にテキストアニメーションを配置する方法 - jquery、animation、jcarousel

私は「jcarouselを使ってスライドショーを作成しましたが、スライドショー内でスライドが遷移した後にテキストをアニメートしたいのです」そのため、スライドが最初に表示され、その後テキストがアニメーション表示されます。

スライドがヒットするたびにテキストアニメーションが表示されるように、コールバック機能を使用する方法を見つけようとしています。

私がやりたいことは、ここで説明していることと似ています。 スライドショーのテキストアニメーションのためのjQueryサイクル

私は「ScrollIntoView」プラグインの使用を検討しましたが、意図したとおりに動作するとは思わないでください。

私がこれを達成する方法を誰かが知っていますか?

どうもありがとう

回答:

回答№1は0

私はこれでやります targetin そして targetout イベントリスナーjcarouselイベントに関する文書 http://sorgalla.com/jcarousel/docs/reference/events.html

また試してみることもできます visiblein そして visibleout

各スライド内にテキスト要素がある場合の設定例

$(".jcarousel")
.on("jcarousel:targetin", "li", function() {
// "this" refers to the item element
// "carousel" is the jCarousel instance
var $slide = $(this);
$slide.removeClass("active-slide");

//sudo code, but put animations here
$slide.find(".text-effect-element").animate();
})
.on("jcarousel:targetout", "li", function() {
// "this" refers to the item element
// "carousel" is the jCarousel instance
var $slide = $(this);
$slide.removeClass("active-slide");

//sudo code, but put animations here
$slide.find(".text-effect-element").animate();
});

親スライドのクラスに応じてCSSアニメーションを使用することもできます。