Jquery 如何在ajax加载的内容中启动Nivo滑块？

当包含Nivo slider的页面被ajax加载时，我很难让它启动

这是HTML

<div class="work">
  <img class="introPic" src="images/thumb.jpg" width="250" height="99" />
    <h3><img class="arrow" src="images/arrow_open.gif" alt="&gt;" /> <a class="titlelink" href="testcontent4.html" rel="address:testcontent4.html">Nivo Slider Project</a></h3>
    <div class="projectIntro">
    <p>This is some intro text for Nivo Slider Project</p>
    </div>
   <div class="pictures"></div>
</div>

这是一个现场演示： Nivo Slider项目是我想要开始工作的项目

可能做了一些基本的错误，因为我是jQuery新手，所以非常感谢您提供的任何帮助

---

非常感谢。

在您的内部。如果要使用函数，请尝试此操作。但是请注意，您必须为.pictures使用正确的nivo滑块html结构

---

事实证明，这里的问题不是代码，而是旧版本的Nivo Slider和当前版本的jQuery 1.7.1之间的冲突。当我回到jQuery1.4.2时，它工作了。然后，我用当前的jQuery将Nivo Slider更新到最新版本，它也起到了作用。

谢谢Catfish-我试过了-与上一个版本不同，它加载了所有图片，但不是幻灯片放映-我还试着放置$'.pictures'.data'nivoslider'.stop.start；}；在content_holder.loadhref+'ajaxContent'之后，函数{-这似乎触发了nivo加载程序，但图像没有加载-更正-单击div.work a将testcontent4.html加载到新页面-这就是为什么您会看到所有图像。请记住div.work a不是链接-上面的jquery使div.work成为可单击的div，这就是为什么我在content_holder.loadhref+之后尝试了您的代码ajaxContent'函数{我已经编辑了我的答案。为什么不先尝试将所有图像放在.pictures div中，并将.pictures的css显示为：none。然后单击div.work，显示图像并启动nivo滑块。不幸的是，我不能这样做，因为我将有很多项目，而ajax的要点是，数据只加载为needed-如果我将所有图像放在.pictures div中，该页面的文件大小会太大，速度会很慢。实际上，我是用上面的原始代码实现的-结果发现这是新版本的jquery的一个问题-当我降级到1.4.2时，它起作用了！我以前也有类似的代码，所以我查看了我与以前的代码之间的差异恩，我现在所拥有的，唯一的区别似乎是查询版本，谢谢你花时间来帮助我，谢谢

$(function(){

   function close_other() {
   var selected_work = $('.selected_work');

    selected_work.children('.pictures').empty();
    $('.selected_work img.arrow').attr("src", "images/arrow_open.gif");
    selected_work.removeClass("selected_work");
 }

  $('div.work a').click(function(e) { e.preventDefault(); });
  $('div.work').bind('click', function() {

$('html,body').animate({ scrollTop: $(this).offset().top }, 500);

var href = $(this).find('a').attr('href'),
    lastPart = href.split('/'),
    hash = lastPart[lastPart.length - 1];

window.location.hash = hash;

var parent = $(this);
var content_holder = parent.children(".pictures");

if (parent.hasClass("selected_work")) {
    close_other();
    return;
}

close_other();

parent.addClass("selected_work");

content_holder.load(href + ' #ajaxContent', function() {

$(this).find('#slider').nivoSlider({

        effect:'fade', //Specify sets like: 'fold,fade,sliceDown'
        animSpeed:300,
        pauseTime:4000,
        controlNav:true,
        pauseOnHover:true //Stop animation while hovering
    });

}); 


    $('.selected_work img.arrow').attr("src", "images/arrow_close.gif");
  });
});

$('div.work').click(function(e) { 
  $('.pictures').show();
  $('.pictures').data('nivoslider').stop().start; //Stop the Slider if it's currently running, then start it.
  e.preventDefault(); 
});