如何给当前显示边框边框

Question

我正在使用Shopify羡慕主题。我有多个产品图片。我想给拇指图像边框，图像显示为主图像。简而言之，当前图像应该有边框。

以下是我想要的示例图像：

小图像是多个不同的拇指图像。如果拇指图像显示在拇指应该有边框的主要大图像中。

这是我的jQuery：

$('a.image-swap').click(function() {
    var newImage = $(this).attr('href');
    $('.featured-image-div img').attr({ src: newImage });
    return false;
});

Answer 1

因此，您使用jQuery来交换图像，您只需在显示的拇指中添加“活动”的css类：

您的JavaScript：

$('#your-element').hover(function() {
    // Your stuff for exchanging the image
    $(this).addClass('active');
});
$('#your-element').mouseleave(function() {
    $(this).removeClass('active');
});

你的CSS：

.thumb.active {
    border: 2px solid black;
}

Answer 2

根据你的代码试试这个：

$('a.image-swap').click(function() {
var newImage = $(this).attr('href');
$( '.featured-image-div img' ).attr({ src: newImage });
$('a.image-swap').removeClass('active');
$(this).addClass('active');
return false;

希望会有效...... :)