2
jQuery(document).ready(function($) {
var $mainContent = $("#main_class"),
    siteUrl = "http://" + top.location.host.toString(),
    url = ''; 
$(document).delegate("a[href*='/classes/']:not([href*=/wp-admin/]):not([href*=/wp-login.php]):not([href$=/feed/]):not([href$=/event-registration/])", "click", function() {
    location.hash = this.pathname;
    return false;
}); 

$(window).bind('hashchange', function(){
    url = window.location.hash.substring(1); 
    if (!url) {
        return;
    } 
    url = url + " #main"; 
    $mainContent.animate({opacity: "0.1"}).html('Please wait...').load(url, function() {
        $mainContent.animate({opacity: "1"});
    });
});
$(window).trigger('hashchange');
$('#slider').royalSlider({            
           imageAlignCenter:true,
           imageScaleMode: "fill",
});

});

ajax コンテンツは正常に機能しますが、コンテンツを ajax div にロードすると、スライダー (ロイヤル スライダー) が機能しません。ロイヤルスライダーを実現するためにコードを変更するにはどうすればよいですか。ワードプレスとカスタムデザインのテーマを使用しています。

4

1 に答える 1

0

コンテキストとHTMLコードがないとわかりませんが$('#slider').royalSlider(...);、新しいコンテンツを読み込んだ後、もう一度呼び出す必要があると思います。

この関数を初めて呼び出すときは、#slider現在DOMにあるものをターゲットにしています。ajax呼び出しで新しいコンテンツをロードするときに、この要素を削除して新しい要素に置き換えます。スライダーをもう一度初期化する必要があると思います。

于 2012-06-07T03:13:08.230 に答える