【九月打卡】第12天 javascript（图片的自动轮播和停止）

1.课程名称：（图片的自动轮播和停止）

课程章节：进入网站后自动轮播，和鼠标停留在图片里不继续滑动

2.课程内容

 

      首先，我们要设置进入网站后轮播图自动轮播，不需要滑动离开后才能生效

        添加

        main.onmouseout();

    

    上面不是有mian.onmouseout了吗，为什么还要添加一个？

    因为上面那一个是方法，我们这一个是事件

    效果：

    

    设置了2秒半自动轮播了

    

    但是我们鼠标停留在图片里，没有停止轮播

    影响用户体验，所以我们需要我们鼠标停留在图片时

    清除定时器

    

    在这里添加

    //滑过清除定时器

    if（timer）clearinterval(timer)

    如果timer为真的话，就清除定时器

    

    现在鼠标停留在图片中就不会自动轮播到下一张了，滑过后，继续轮播下一张图片

    

    效果:

    

    三：本章重点

    没有重点哈，只有两小行的代码 O(∩_∩)O，理解就可以了