jQuery を .load() 関数で動作させるのに問題があります。
スクリプトは、指定されたページ コンテンツを #project div にロードし、正常に動作している flexslider を初期化します。
問題は、次/前の投稿に移動するために矢印を追加しようとしていることですが、もちろん、矢印の .load 関数を下の最初の .load 関数の外側に配置すると、コードは機能しません。
以下の .load 関数内にもそれらを入れてみましたが、最初の投稿ではうまくいきました。その後、すべての jQuery が初期化を停止しました (flexslider、さらには左/右矢印のクリック機能も)。
無制限の .load() ループか何かをしなければならないようです。私は理にかなっているといいのですが、誰かが助けてくれることを願っています。これが私が持っているもので、矢印を除いたものです。
質問を要約すると.. jQueryを.load()内で再初期化せずに.load()関数で動作させる方法はありますか?
jQuery('.single-item, .portfolio-images article').click(function() {
var geturl = window.location;
var next_project = jQuery(this).attr('data-projectid');
jQuery('html, body').animate({ scrollTop: 0 }, 500);
jQuery('#project').slideUp('slow');
jQuery('#project').load(geturl + "?page_id=" + next_project + " .project", function() {
if (jQuery(this).hasClass('opened')) {
jQuery(this).slideDown(600);
jQuery('.flexslider').fadeIn();
} else {
jQuery(this).slideDown(300);
jQuery('.flexslider').fadeIn();
}
jQuery('.grid').click(function() {
jQuery('#project').slideUp(500);
});
// Initialize Scripts
jQuery('.flexslider').flexslider({
animation: "slide",
smoothHeight: true,
startAt: 0,
});
});
}).addClass('opened');
return false;