什么是内容滑块？

正如我们已经看到的，"照片滑块"可以在网页的有限空间中有效展示图片。
但是有时候我们需要显示链接了一些信息的图像。
例如，文字信息，到其他页面的超链接，按钮，其他嵌入式图像等。

在内容滑块中，每个幻灯片都是DIV容器元素，而不是像IMG这样的块元素。
因此，您可以其中添加尽可能多的子元素。
唯一的限制是您的内容应在幻灯片实际区域的范围内。

内容滑块比简单图像滑块的优势

• 任何类型的内容都可以像幻灯片一样滚动。

• 通过直接从其他Web来源提取信息，可以使文本内容动态化。

• 超链接，按钮，音频和视频等可以轻松地集成到幻灯片中。

• 该应用程序之一是通过将滑块与后端数据库正确集成来创建在线文档阅读器。
  (似乎很难！我也可以编写一个教程。
  )

• 综上所述，"内容"滑块比"平凡的图像"更具交互性。

什么是分页？

分页是用数字索引列表的方法，其中每个索引对应于特定的幻灯片。
分页在任何滑块中的一种可能应用是可访问性。
您随时可以直接导航到特定幻灯片。
它们有助于对任何有序滑块进行排序。
使用这种排序机制，可以指导用户浏览幻灯片。

jQuery Content Slider的前提条件

本文假定读者具有有关什么是网页的基本知识，HTML基本标签，很少CSS属性和JavaScript知识。
您可以访问www.w3schools.com上的这些主题。
要了解有关jQuery基本功能的更多信息，您可以阅读此处发布的其他jQuery教程。
那些熟悉这些内容的人可以直接从"实施内容滑块"部分开始。

实现jQuery Content Slider

现在有了HTML，CSS和JavaScript的一些基本背景，我们可以继续执行内容滑块。
只需遵循以下准则；

• 创建目录结构
  让我们在Root目录中的文件夹之间组织不同的资源。
  " ContentPagiSlider"是我们的Root文件夹，其中包含带有其他子文件夹HTML文件。

• " scripts"文件夹包含Javascript库，例如jQuery和其他一些脚本文件。

• " styles"文件夹包含定义不同HTML标签样式CSS文件。

• "图片"文件夹包含用作幻灯片背景的图片。

jQuery内容滑块

注意：如果您使用的是Chrome浏览器并想调试脚本，则可以按[F12]键并单击"控制台"选项卡，单击按钮即可查看"当前"计数器的变化情况。