2012-08-02 126 views
1

我一直在研究这段代码。我试图在图库页面加载ajax后实现SmoothDivScroll jquery插件。这是我的js与ajax。请注意,smoothdivscroll工作正常,无需使用ajax加载图库。jquery插件在ajax载入页面时未加载

$(document).ready(function(){ 

    $('.more').live('click',function(){ 
     var href = $(this).attr('href'); 
     if ($('#ajax').is(':visible')) { 
      $('#ajax').css('display','block').animate({height:'1px'}).empty(); 
     } 
     $('#ajax').css('display','block').animate({height:'380px'},function(){ 
      $('#ajax').html('<img class="loader" src="images/loader.gif" alt="">'); 
      $('#ajax').load('content.php #'+href, function(){ 
       $('#ajax').hide().fadeIn().highlightFade({color:'#717171'}); 
      }); 
     }); 
     return true; 
    }); 

    $("div#makeMeScrollable").smoothDivScroll({ 
     mousewheelScrolling: true, 
     manualContinuousScrolling: true, 
     visibleHotSpotBackgrounds: "always", 
     autoScrollingMode: "onstart" 
    }); 

}); 

更新:虽然@Mathletics答案的确得到了插件调用它的回调来加载,该smoothscrollingdiv并不那么顺利。图片不内联,滑动非常不平稳。它工作得很好,无需通过ajax加载它。下面我提供了它与ajax和没有的相似的链接。

阿贾克斯加载:select gallery from the menu

没有阿贾克斯:This is how the gallery is supposed to be

回答

1

移动电话smoothDivScroll到您的回调。

$(document).ready(function(){ 

    $('.more').live('click',function(){ 
     var href = $(this).attr('href'); 
     if ($('#ajax').is(':visible')) { 
      $('#ajax').css('display','block').animate({height:'1px'}).empty(); 
     } 
     $('#ajax').css('display','block').animate({height:'380px'},function(){ 
      $('#ajax').html('<img class="loader" src="images/loader.gif" alt="">'); 
      $('#ajax').load('content.php #'+href, function(){ 
       $('#ajax').hide().fadeIn().highlightFade({color:'#717171'}); 
        $("div#makeMeScrollable").smoothDivScroll({ 
        mousewheelScrolling: true, 
        manualContinuousScrolling: true, 
        visibleHotSpotBackgrounds: "always", 
        autoScrollingMode: "onstart" 
       }); 

      }); 
     }); 
     return true; 
    }); 


}); 
+0

插件加载,但无法正常滚动。 – user1165309 2012-08-02 18:24:26