2012-04-09 19 views
0

AJAXで画像スライダを読み込もうとしています。スライダを含むページの直接URLを入力するときは、正常に動作します。しかし、AJAX経由でロードしようとすると、ロードされません。AJAX経由で画像スライダを読み込む

$('.ajaxed').live('click', function(event) { // loading page via AJAX 
    event.preventDefault(); 
    var link = $(this).attr('href')+' #content'; // jQuery address variables 
    var rewritepath = link.replace($url,'').replace(' #content',''); // jQuery address variables 
    $('#board').load(link,'', function(){ 
     $('html,body').delay(500).animate({scrollTop: 0}, 300, function() { 
      $('#board').slideDown('slow'); 
     }); 
    }); 
    $.address.state($path).crawlable(true).value(rewritepath); // jQuery address 
    return false; 
}); 
$slider.royalSlider({ 
    captionShowEffects:["fade"], 
    controlNavThumbs:true, 
    controlNavThumbsNavigation:true,   
    imageAlignCenter:true, 
    imageScaleMode: "fill", 
    welcomeScreenEnabled:false, 
    hideArrowOnLastSlide:true, 
    autoScaleSlider: true, 
    autoScaleSliderWidth: 980, 
    autoScaleSliderHeight: 650 
}); 

スライダコードを.ajaxedパーツに配置すると、AJAXを使用してのみ動作しますが、ページが直接ロードされている場合は動作しません。

答えて

0

スライダのinitコードを関数に入れるだけで、どこからでも呼び出すことができます。例:

$('.ajaxed').live('click', function(event) { // loading page via AJAX 
    event.preventDefault(); 
    var link = $(this).attr('href')+' #content'; // jQuery address variables 
    var rewritepath = link.replace($url,'').replace(' #content',''); // jQuery address variables 
    $('#board').load(link,'', function(){ 
     $('html,body').delay(500).animate({scrollTop: 0}, 300, function() { 
      $('#board').slideDown('slow'); 
     }); 
     init_slider(); 
    }); 
    $.address.state($path).crawlable(true).value(rewritepath); // jQuery address 
    return false; 
}); 

init_slider(); 

function init_slider() { 
    $slider.royalSlider({ 
     captionShowEffects:["fade"], 
     controlNavThumbs:true, 
     controlNavThumbsNavigation:true,   
     imageAlignCenter:true, 
     imageScaleMode: "fill", 
     welcomeScreenEnabled:false, 
     hideArrowOnLastSlide:true, 
     autoScaleSlider: true, 
     autoScaleSliderWidth: 980, 
     autoScaleSliderHeight: 650 
    }); 
} 
関連する問題