JQuery 综合案例&抽奖

最新推荐文章于 2023-09-01 22:51:09 发布

Joyce_lulu

最新推荐文章于 2023-09-01 22:51:09 发布

阅读量432

点赞数

文章标签： JQ

本文链接：https://blog.csdn.net/Joyce_lulu/article/details/100133290

版权

本文通过一个具体的抽奖案例，深入探讨JQuery在实现交互功能中的应用。利用JQuery的事件监听和动画效果，创建了一个点击停止的动态图片抽奖效果。读者将了解如何使用JQuery的onclick事件及动画函数来增强网页的用户体验。

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

$[外链图片转存失败(img-6yASpiJV-1567046827205)(C:\Users\Tang\Desktop\2.JPG)]$

<head>
    <meta charset="UTF-8">
    <title>jquery案例之抽奖</title>
    <script type="text/javascript" src="../js/jquery-3.3.1.min.js"></script>
    <script type="text/javascript">
        /*
            分析：
                1. 给开始按钮绑定单击事件
                    1.1 定义循环定时器
                    1.2 切换小相框的src属性
                        * 定义数组，存放图片资源路径
                        * 生成随机数。数组索引


                2. 给结束按钮绑定单击事件
                    1.1 停止定时器
                    1.2 给大相框设置src属性

         */
        var imgs = ["../img/1.jpg",
                    "../img/2.jpg",
                    "../img/3.jpg",
                    "../img/4.jpg",
                    "../img/5.jpg&#