我为我的网站使用 RoyalSlider,我想将每个 slider 的背景颜色更改为不同的颜色。
我要更改的 div 是#slide6,如下所示:
$('#slide6').css({"background-color":"red"});
但我不知道该怎么做。这是 HTML 结构
<div id="content-slider-1" class="royalSlider contentSlider rsDefault">
<div>
<h3>Slide HTML Text</h3>
<p>This is dummy copy.</p>
<span class="rsTmb">HTML text</span>
</div>
也许我可以使用类似 data-color='red' 的东西,然后将 if/else 用于背景颜色?
我可以通过以下方式查看每张幻灯片的数据:
var slider = $('#content-slider-1').data('royalSlider');
slider.ev.on('rsBeforeAnimStart', function() {
console.log( $('#content-slider-1').data('royalSlider').currSlide );
});
有人可以帮我解决这个问题吗?非常感谢!
最佳答案
您可以在包装每张幻灯片的 div 上添加一个类,并通过 CSS 控制背景颜色
<div id="content-slider-1" class="royalSlider contentSlider rsDefault">
<div class="slide1">
<h3>Slide HTML Text</h3>
<p>This is dummy copy.</p>
<span class="rsTmb">HTML text</span>
</div>
<div class="slide2">
<h3>Slide HTML Text</h3>
<p>This is dummy copy.</p>
<span class="rsTmb">HTML text</span>
</div>
.slide1 {background-color: red}
.slide2 {background-color: blue}
关于jquery - RoyalSlider 使用每张幻灯片从 div 更改背景,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/15386478/