Javascript 如何完成清洁横幅

我需要帮助如何完成这个非常简单和干净的横幅

对于课文，我认为没关系。我需要改变每个文本在同一时间作为背景色

横幅有3个步骤，3种不同的背景颜色和文本（如果可能，带有淡入效果）

我没有解决办法

请帮帮我

PS：这是我的示例作品：

TEXT 1

---

谢谢

在您的JSFIDLE示例中，您可以做到：

var texts = ["TEXT 1", "TEXT 2", "TEXT 3"];
var colors = ['#FF0000', '#00FF00', '#0000FF'];
var count = 0;
function changeText() {
    $("#example").text(texts[count]);
    $("#example").css({'background-color': colors[count]});
    count < 3 ? count++ : count = 0;
}
setInterval(changeText, 1000);

要更改颜色，您可以执行以下操作

$("#example").css({'background-color': 'yellow'});

---

淡入背景色 要进行褪色，您需要使用 以下是您的操作方法：

$('#example').animate({backgroundColor: '#FF0000'}, 'slow');

---

提到他必须从html代码中删除

background:red

background属性重写

background color`property.@SharikovVladislav如果他删除了

background:red

，那么当页面加载时，背景在javascript运行之前是透明的。他可以在页面加载时设置背景颜色，但这通常是一种不好的做法。他必须设置

背景颜色：红色

，而不是

背景颜色：红色

。正如我所说-

background

属性覆盖

background color

属性，它是由jQuery设置的。太棒了！谢谢小问题。。。在每种颜色之间加入一点冷色调效果。有可能吗？而对于bg的颜色是否可以放一个css背景渐变？Tnx@MyFirstLog你确实可以做渐变，你只需要添加适当的css样式。看看这一点，看看淡出的效果，使用jQuery是不容易做到的。我们需要使用jQueryUI。看看我编辑过的答案

$("#example").css({'background-color': 'yellow'});

$('#example').animate({backgroundColor: '#FF0000'}, 'slow');