javascript - 如何使用固定文本创建图像幻灯片?

标签 javascript html css slideshow

我想创建一个图像幻灯片放映,其中背景图像一张一张地滑动,但文本应该 float 在它上面。

我想要实现的最后一件事是this .

我已关注 msdn 中的帖子文章,我下载了 slideShow.js 文件并应用到图像上,它运行良好。现在如何将文本 float 到图像上?

我的代码是:

<!DOCTYPE html>
<html>

<head>
  <meta content="text/html; charset=utf-8" http-equiv="Content-Type">
  <title>Slide Show</title>
  <style type="text/css">
    .size
    {
        height:300px;
        width:500px;
    }
    .lab
    {}
  </style>
</head>

<body>
    <div>

        <label class="lab">This is Label</label>
      <div id="slideShowImages">
        <img src="1.jpg" alt="Slide 1" class="size" />
        <img src="2.jpg" alt="Slide 2" class="size"/>
        <img src="3.jpg" alt="Slide 3" class="size"/>    
        <img src="4.jpg" alt="Slide 4" class="size"/>
      </div>  
    </div>
  <script src="slideShow.js"></script>
</body>

</html>

标签将是显示在图像上的文本。 请帮忙。

最佳答案

安装 WoW Slider 并导入所有要滑动的图像,您还可以为每张图像添加文本,这样当图像滑动时相应的文本也会随之出现

http://wowslider.com/ - 可以选择自己喜欢的滑动模板

关于javascript - 如何使用固定文本创建图像幻灯片?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/19921508/

相关文章:

javascript - 如何检查 id IndexedDB 是否已存在于 React 生命周期方法中

javascript - Bootstrap Form Helper - 在国家选择器上动态选​​择国家

javascript - 具有用于 .click 事件的多个按钮的 Ajax 函数

javascript - 如何去除传单中的一层

html - 仅在 Bootstrap 4 figure-img 中叠加

html - 隐藏的可点击链接在 IE 中没有背景颜色时不起作用

CSS - 在包含它的 div 滚动时更改链接颜色

javascript - .css() 的 jQuery 问题

HTML5 三页布局栏目

javascript - 始终检查输入单选元素结果