我在切换滑块的多个背景图像时遇到问题。
例如,在我的CSS中,我以前的背景是
body {
cursor: crosshair;
background: url(http://mythologian.net/wp-content/uploads/2017/01/lotus-flower-meaning-symbolism.jpg) no-repeat center center;
background-size: cover;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
}
此功能仅能将一张图片过渡到第三张幻灯片。 (第一个是使用vid.js在后台播放视频。)
我的问题:过渡到第三张图像后,如何继续对多张图像进行简要说明。
为了让您对我在说什么有个更好的了解,我创建了一个CodePen项目,以便您能有第一手的印象。
这是我遇到的问题:
<!--This is where I want to have a third background -->
<div id="background">
<div class="content">
<h1>Lotus Flower</h1>
<p class="data">
Back in Egyptians times, the lotus flower was very important in their religion. Meaning creation and rebirth, it was a symbol of the sun, because at nightfall it closes and goes beneath the water and at dawn it climbs up above the water and reopens.
</p>
</div>
</div>