Javascript Lightbox脚本(view.js)没有';t使用tumblr无限卷轴

Javascript Lightbox脚本(view.js)没有';t使用tumblr无限卷轴,javascript,tumblr,Javascript,Tumblr,我已经为tumblr公文包()编写了一个主题,其中包括使用view.js()添加lightbox支持 到目前为止,我设法让所有东西都正常工作,但当我有超过15个项目时,无限卷轴启动了,整个灯箱就崩溃了。我猜是因为创建页面时页面上的新项目不在那里,lightbox脚本不会检测到它们 有人知道是否有可能以某种方式让它工作吗?我需要另一个lightbox脚本吗?好的,基本上你的问题是view.js在AJAX调用后不会自动更新,这很糟糕 您可以按如下方式强制更新view.js: new View( $(

我已经为tumblr公文包()编写了一个主题,其中包括使用view.js()添加lightbox支持

到目前为止,我设法让所有东西都正常工作,但当我有超过15个项目时,无限卷轴启动了,整个灯箱就崩溃了。我猜是因为创建页面时页面上的新项目不在那里,lightbox脚本不会检测到它们


有人知道是否有可能以某种方式让它工作吗?我需要另一个lightbox脚本吗?

好的,基本上你的问题是view.js在AJAX调用后不会自动更新,这很糟糕

您可以按如下方式强制更新view.js:

new View( $('.view') );
您可以在向下滚动后将其粘贴到控制台中进行测试,现在图像将正常工作

但是,您必须找到在无限滚动启动后每次DOM更新时运行它的方法

让我们用另一种方式来做。 在主题中的某个位置添加这行代码:

$(document).on('click', 'a.imageView', function(e){
    e.preventDefault();
    $('.viewer').remove(); //This is to remove any previous viewers
    var s = $(this).attr('href');
    var v = new View ($('.imageView')); 
    v.open(); 
    v.show(s);
});
这段代码的作用是在整个文档上创建一个侦听器,每次单击时,如果单击的元素是带有“视图”类的锚定元素,那么它就会运行该函数。 然后,它手动创建一个新视图,数组中填充了所有图像。这不是最好的解决方案,因为它每次都会构建阵列,但应该可以解决您的问题

希望这有帮助

更新:好的,现在我们将使用锚点的href属性,以便获得真实的图像,而不是缩略图。 另外,view.js的设置似乎是为了自动获取“view”类,因此将锚点类从“view”更改为“imageView”。这样我们就不会打开两个灯箱。
此外,由于我们每次单击图像时都会创建一个新对象,因此需要使用remove()删除所有以前的查看器。

谢谢您的帮助。我已经实现了您的解决方案,它可以正常工作(sorta),但是我认为它有一个副作用,即打开您在下面初始灯箱顶部的新查看器中单击的图像的缩略图大小版本。如果你想知道我的意思,那是现场直播。好吧,那是我的错。我瞄准的是拇指图像,而不是真实的图像。你也应该改变锚类,这样你就不会有两个灯箱。我用更新的代码和解释更新了上面的答案。我们正在调用view.js,但不同的是,它在一开始拍摄所有照片并将它们放入一个数组中,现在我们一次只拍摄一张照片。不过,我现在将尝试使用它,看看是否可以让它将新照片推送到阵列中,以便您拥有所有功能。我更新了答案,以便它存储整个阵列。左和右现在应该可以工作了。至于permalink页面,是否可以在模板中更改它,以便锚定在permalink页面上没有imageView类?对不起,我是个白痴。我编辑了答案,新视图([$('.imageView'))中的括号是多余的…因此正确的行是:新视图($('.imageView'));