Question

我正在做一个tumblr theme的黑客，使其更像是一个响应式的照片库，而不是打开一个帖子并显示一堆笔记，这样我就不在乎了关于。我注意到照片集在灯箱中打开，我发现this post可用于将该灯箱应用于标准照片。

这一切都适用于分页库，但我希望它能够与主题infinite scrolling一起使用。但是，当我打开它时，它添加了新的照片帖子很好，但它完全省略了控制灯箱点击事件的嵌入式JavaScript。

例如，这里有一张工作照片的div：

<article class="post photo" style="position: absolute; left: 1064px; top: 807px;">       
<!--Modified to open photos in lightbox-->
<figure class="photo-content" width="250" height="354">

<a href="http://charlie-bowater.deviantart.com/art/Shallows-566690276"><img class="photo-post-photo" src="http://40.media.tumblr.com/ae09f12fce484f6265753eb05da0c3ee/tumblr_nwmbgfE1OW1tvnxcqo1_250.jpg" id="photo_131890640965" data-retina="http://36.media.tumblr.com/ae09f12fce484f6265753eb05da0c3ee/tumblr_nwmbgfE1OW1tvnxcqo1_500.jpg" alt=""></a>
</figure>
<script class="inline_embed" type="text/javascript">
    var domain = document.domain,
    photo_131890640965 = [{
        "width": "700",
        "height": "990",
        "low_res": "http://40.media.tumblr.com/ae09f12fce484f6265753eb05da0c3ee/tumblr_nwmbgfE1OW1tvnxcqo1_250.jpg",
        "high_res": "http://36.media.tumblr.com/ae09f12fce484f6265753eb05da0c3ee/tumblr_nwmbgfE1OW1tvnxcqo1_1280.jpg"
    }];

    function event_is_alt_key(e) {
        return ((!e && window.event && (window.event.metaKey || window.event.altKey)) || (e && (e.metaKey || e.altKey)));
    };

    document.getElementById('photo_131890640965').onclick = function (e) {
        if (event_is_alt_key(e)) return true;

        window.parent.Tumblr.Lightbox.init(photo_131890640965);

        return false;
    }
</script>
<!--End of Lightbox Modification-->
</article>

这里有一个由无限卷轴添加的内容：

<article class="post photo" style="position: absolute; left: 0px; top: 1163px;">        
<!--Modified to open photos in lightbox-->
<figure class="photo-content" width="250" height="309">

<a href=""><img class="photo-post-photo" src="http://41.media.tumblr.com/80918d59b37dfa13dbae2004b6a6345a/tumblr_nwromsbytb1rqat58o1_250.jpg" id="photo_131890115135" data-retina="http://41.media.tumblr.com/80918d59b37dfa13dbae2004b6a6345a/tumblr_nwromsbytb1rqat58o1_500.jpg" alt=""></a>
</figure>

<!--End of Lightbox Modification-->
</article>

所以无限卷轴版本似乎有但是嵌入式javascript，它们为每张照片初始化灯箱。

我考虑过的事情：

脚本标记缺少一个关键的id / class：但是无限滚动查找的唯一标签是＆＃39; .post＆＃39; class，脚本标记在
也许它从其他地方拉出一个模板：但是我放在那里的评论被复制以及img上的id，所以我的一些修改存在
jQuery避免复制脚本标签：但是我挖掘了代码并在jQuery.load()和jQuery.children()上找到了无限滚动运行，我在jsfiddle的一个小概念验证中测试了这两个，发现它应该能够通过该方法检索脚本标签。

所以我或多或少地想出了为什么它没有将脚本标签添加到由无限滚动创建的新帖子中。是否有任何关于可能出错的想法，或者更好的方法来解决这个问题？

Tumblr Lightbox with Infinite scroll：附加的照片会丢失嵌入的脚本标记

0 个答案: