2012-11-27 2 views
2

ajax에서 flexslider를로드하려고합니다. 슬라이더가 포함 된 페이지를 직접 가리킬 때 작동하지만 아약스에서 슬라이더가로드되지 않습니다. 여기 ajax에서 flexslider로드

내 아약스 페이지입니다 :

$(document).ready(function(){ 

//Ajax Event Handler For Categorie Demo 
var $menu1 = $('#navDemo02'); 



function success(){ 

    $('div.ajaxContent').hide(); 
    $('div.ajaxContent').show(200); 
} 

function ajaxCallTimeout(index){ 
var url = 'categorie/0'+(index+1)+'.php'; 
$('div.ajaxContent').load(url, success); 
} 
function ajaxCategorie(){ 
    var index = $menu1.find('li a').index(this); 
    $('div.ajaxContent').html('<p style="color:#4CC3EC; text-align:center; margin-top:45px;">Loading...<img src="img/loading.gif" /></p>'); 
    switch(index){ 
     case 0 : 

       $('div.ajaxContent').stop().animate({marginTop: 0}, 1000,'linear', function(){ajaxCallTimeout(index)}); 
     break; 
     case 1 : 

       $('div.ajaxContent').stop().animate({marginTop: 0}, 1000,'linear', function(){ajaxCallTimeout(index)}); 
     break; 
     case 2 : 

       $('div.ajaxContent').stop().animate({marginTop: 0}, 1000,'linear',function(){ajaxCallTimeout(index)}); 
     break; 
     case 3 : 

       $('div.ajaxContent').stop().animate({marginTop: 0}, 1000,'linear', function(){ajaxCallTimeout(index)}); 
     break; 
     case 4 : 

       $('div.ajaxContent').stop().animate({marginTop:0}, 1000,'linear', function(){ajaxCallTimeout(index)}); 
     break; 
     case 5 : 

       $('div.ajaxContent').stop().animate({marginTop: 0}, 1000,'linear', function(){ajaxCallTimeout(index)}); 
     break; 
     case 6 : 

       $('div.ajaxContent').stop().animate({marginTop: 0}, 1000,'linear', function(){ajaxCallTimeout(index)}); 
     break; 


    } 
} 

$menu1.find('li a').bind('click', ajaxCategorie); 

}); 여기

슬라이더

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script> 
<script>window.jQuery || document.write('<script src="js/libs/jquery-1.7.min.js">\x3C/script>')</script> 

<script defer src="jquery.flexslider.js"></script> 

<script type="text/javascript"> 
$(function(){ 
    SyntaxHighlighter.all(); 
}); 
$(window).load(function(){ 
    $('.flexslider').flexslider({ 
    animation: "slide" 
    }); 
}); 

누군가가 내가 없거나 튜토리얼을 저를 지적하고 무엇을 말해 줄 수의 스크립트입니다?

답변

0

언급 한 클래스를 DOM에로드하기 전에 클래스에서 flexslider() 함수를 호출하고 있습니까?

링크를 클릭하여 아약스 전화를 걸면 해당 페이지의 자바 스크립트가 이미 실행 된 것입니다. 이제 아약스 호출을하면 스크립트가 다시 실행되지 않아 새로운 클래스 (즉, 아약스를 통해 호출 된)에서 flexslider를 다시 할당합니다.

이것이 사실이라면 flexslider 스크립트를 ajax 호출을하는 페이지로 옮겨보십시오.

+0

어떻게 다시 실행할 수 있습니까? 나는 내가 여기에 비슷한 문제가 있다고 생각 : http://stackoverflow.com/questions/25194457/js-error-after-ajax-get-load – calav3ra