Question

我遇到的问题是这个，我想把我正在处理的主题中的所有<img>转换成一个插件，这意味着让叠加层工作（我我认为我已经完成了）然后从下一个/上一个div中调用下一个/上一个h <img> <a href>标记为（{1}}的{{1}}我最接近的是拥有下一个按钮转到下一个招聘.img-main，上一个按钮回到第一个...我不知道任何帮助都会非常感谢。

所以我想我的问题是我如何点击按钮将当前<img> {覆盖的src替换为下一个img href }＆gt; .post？

.img-main

这是一个tumblr主题，所以对于不懂语法的人来说可能有点混乱，但我确实有一个实例，所以你可以看到。

DEMO：http://unnaturalchoices.tumblr.com

演示中的一些图像是NSFW

编辑：感谢 wmonk 的帮助，虽然我认为仍然存在一些错误，但img立即加载它只会在我点击时加载上一页按钮和前进通过帖子不起作用（参见演示）＆gt;在safari 6.0.5和chrome 27.0上测试......

编辑刚刚使用插件...

Answer 1

尝试使用以下代码替换您的点击事件代码：

$('.post').on('click', 'a', function overlayShow(e){
    e.preventDefault();

    var elem = $(this),
        parent = elem.parents('.post'),
        photoId = (elem.find('.img-main').attr('href'));

    parent.addClass('selectedImg');

    $('body')
        .css('overflow','hidden')
        .find('#overlay').show()
        .find('.overlay-img').attr('src', photoId);

    $('.next-img').on('click', function(e){
        e.preventDefault();

        nextImg = $('.selectedImg').removeClass('selectedImg').prev('.post').addClass('selectedImg').find('a').attr('href')
        $('.overlay-img').attr('src', nextImg);

    });

    $('.prev-img').on('click', function(e){
        e.preventDefault();

        prevImg = $('.selectedImg').removeClass('selectedImg').prev('.post').addClass('selectedImg').find('a').attr('href')
        $('.overlay-img').attr('src', prevImg);

    });

    return false;

});

Answer 2

您的代码现已在实际网站上更改。要解决图像加载问题，请更改：

var elem = $(this),
    parent = elem.parents('.post'),
    photoId = (elem.find('.img-main').attr('href'));

到：

var elem = $(this),
    parent = elem.parents('.post'),
    photoId = (elem.find('a:first').attr('href'));

Tumblr主题照片叠加到下一张照片网址？

2 个答案: