0

你能看看这个链接，让我知道，让我知道如何在画廊轮播控制点击到拇指上添加类 .highlight 吗？

正如您从代码中看到的那样，我使用以下代码突出显示选定的拇指：

var classHighlight = 'highlight';
var $thumbs = $('.thumbnail').click(function(e) {
e.preventDefault();
$thumbs.removeClass(classHighlight);
$(this).addClass(classHighlight);
});

好吧，我不确定这是正确的方法，但它对我有用！但正如我所说，这是在点击 .thumbnail 但我需要的是在滑动事件中将类添加到缩略图中。我已经将此 CSS 添加到我的代码中，但它不起作用！

.thumbnail:active{
  border-style:solid;
  border-width:5px;
  border-color:gery;
  }

感谢您的时间和评论

4

1 回答 1

1

您可以更改 on slide 功能来做到这一点（添加了 2 条底线）：

   // When the carousel slides, auto update the text
    $('#myCarousel').on('slid', function (e) {
            var id = $('.item.active').data('slide-number');
            $('#carousel-text').html($('#slide-content-'+id).html());
        $('#slider-thumbs > div > ul > li > a').removeClass('highlight');
        $('#carousel-selector-'+id).addClass('highlight');
    });

要在页面加载时选择第一个缩略图，请在轮播初始化后在顶部添加此行：

   $('#carousel-selector-0').addClass('highlight');

小提琴：演示

于 2013-06-21T05:19:50.463 回答