addClass激活到滑块拇指

时间:2016-03-12 07:38:44

标签: jquery css

我正在尝试在单击.thumb时向img添加活动类。

我正在尝试做什么: enter image description here

我得到了什么: enter image description here

$(document).ready(function() {

$(".thumb").click(function() {
var IMG = $(this).find("img").addClass('active');
$(".viewer").not($(this).siblings().find('img').removeClass('active').parent().after()).remove();

var top = $(this).offset().top - 10; 
// window.scrollTo(0, top); // no animation
$('html, body').animate({ scrollTop: top }, 100);

$(this).parent().after("<div class='viewer'><div class='content-slide'><img src='' /><p class='exit'>✖</p><h2></h2><span></span></div></div>");

$(".viewer").find("img").attr("src", IMG.attr("data-HD"));
$(".viewer").find("h2").text(IMG.attr("title"));
$(".viewer").find("span").text(IMG.attr("description"));
$(".content-slide img").height($(".viewer").height());
$("p.exit").click(function() {
$(this).closest(".viewer").slideUp(200, this.remove);
$("img").removeClass('active'); 
});
});

});

演示:http://codepen.io/anon/pen/NNrQWe

1 个答案:

答案 0 :(得分:2)

点击拇指时删除课程

var IMG = $("img").not($(this).find("img").addClass('active')).removeClass("active");

DEMO