jquery - 使用javascript动态文本加粗

Question

我正在使用 jquery cycle 库在网页上呈现图片幻灯片。

我有 5 张图片我想滚动浏览，每张图片都有一段文字，我想在显示时加粗。

我不确定它是否使它更简单，但顺序总是相同的，而且我有一个来自循环的回调方法。

那么，在每次回调时，我如何才能将五个文本简介中的一个加粗？是的，它必须循​​环回到第一个。

我需要加粗的文本当前在“幻灯片”div 中显示如下:

<div id="column slideshow">

           **slideshow magic here*

                    <ul>
                    <li>blurb1</li>
                    <li>blurb2</li>
                         ...
                    </ul>
</div>

我想知道如何解决这个问题，我对前端开发和 javascript 还很陌生。谢谢!

Answer 1

使用 after 和 before 回调将 active 类添加到幻灯片中的当前元素，然后使用 为该类设置样式>字体粗细:粗体。

JavaScript

$('#slideshow').cycle({
    after: function(el, nextEl) {
        $(nextEl).addClass('active');
    },
    before: function(el) {
        $(el).removeClass('active');
    }
});

CSS

#slideshow li.active { 
    font-weight: bold;
}