轮播图html

题十二:轮播图

要求:
1.鼠标不在图片上方时,进行自动轮播,并且左右箭头不会显示;当鼠标放在图片上方时,停止轮播,并且左右箭头会显示;
2.图片切换之后,图片中下方的小圆点会同时进行切换,并且点击相应的小圆点可以切换到相应的图片上;
3.点击左右箭头可以进行左右图片的切换;
4.图片上需有介绍的文字,会随图片切换一起进行切换。

原理:

  1. 当鼠标进入时,左走箭头出现,定时器关闭,离开时,箭头消失,定时器开启。
  2. 写DOM对应的小圆点,找让图片文字小圆点的高亮移除,再当索引值到了之后,添加高亮事件.
  3. 当点击左图右图是分别修改其对应的索引号.




    
    
    自定义轮播图
    



    
图片1
fall'in out
图片2
找自己
图片3
单车恋人
< >

你可能感兴趣的:(html,前端,javascript)