HTML 5 的自定义 data-* 实现图片切换或者轮播

red_heel

于 2018-05-30 20:56:49 发布

阅读量1.6k

点赞数

分类专栏： JavaScript Jquery html

本文链接：https://blog.csdn.net/red_heel/article/details/80515769

版权

本文介绍了如何利用HTML5的自定义data-*属性和jQuery实现图片切换功能，无需依赖外部插件。首先解释了data属性的使用方式，然后详细说明了通过.data()方法设置和获取data-*属性值，以此控制图片的切换状态。

摘要由CSDN通过智能技术生成

除了用swipper等插件实现图片的切换之外，我们通过引入html5规范中的自定义data属性来实现图片切换。

在详细介绍怎么实现切换之前，先介绍data属性的使用方法。

 
  < 
  div 
  class= 
  "dragon_eggs" 
  > 
 
 
  < 
  img 
  src= 
  "./img/dragon_egg1.png" 
  alt= 
  "" 
  id= 
  "dragon_eggImg" 
 

关注

专栏目录