Question

......但由于某种原因，它不会起作用。初学者，所以如果有人能解释我做错了什么，我真的很感激。的xD

http://codepen.io/DylanEspey/pen/xgwJr Codepen的一个例子我很快就拼凑起来试图说明我的问题。

我讨厌我不得不问这么多问题，但这是我的第一个项目，我有自己的余地，而且我一直在努力完成它截止日期，所以我可以打动人。 xD那个和大学让我的日程变得一团糟，所以我一直在犯愚蠢的错误。那，几周前我刚开始学习Javascript ......

Answer 1

试试这个：

$('.thumbnails img').click(function () {
    var thmb = this;
    var src = this.src;
    $('.project-img img').fadeOut(400, function () {
        thmb.src = this.src;
        $(this).attr('src', src).fadeIn(400);
    });
});

<强> Fiddle Demo

Answer 2

问题是用于淡入淡出效果的叠加层会阻止您点击其下方的图像。解决方案是，而不是听取图像上的点击，在叠加层上听取它，并相应地调整参考。

我已将您的codepen分叉以反映这一点：http://codepen.io/anon/pen/qlkob

JS：

$(document).ready(function() {
    $('.thumbnails .overlay').click(function() {
        var img = $(this).find('img')[0];
        var thmb = img;
        var src = img.src;
        $('.project-img img').fadeOut(400,function(){
            thmb.src = this.src;
            $(this).attr('src', src).fadeIn(400);
        });
    });
});

交换图像Src JQuery不工作？

2 个答案: