jQuery无缝滚动的抽奖机(原创)
letGo -为开始方法 loop - 为无缝滚动 loop - 中的top为滚动速度 loop - 中的回调方法2470是单张图片的高度*10得到的参数 stopGo - 为停止方法 num1，2，3分别控制各个数字的坐标，*11是为了滚两圈，*1为滚一圈的1，*2为滚一圈的2，依次类推 pubAnimate - 为封装过渡效果，实际参数为：pubAnimate(指定的元素，指定的数字)
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<link rel="stylesheet" href="https://www.jq22.com/demo/jqueryCj202311202321/css/reset.css">
<link rel="stylesheet" href="https://www.jq22.com/demo/jqueryCj202311202321/css/index.css">
</head>
<body>
<div class="container">
<div class="wrap">
<img class="core" src="https://www.jq22.com/demo/jqueryCj202311202321/images/core.png" />
<img class="btn" src="https://www.jq22.com/demo/jqueryCj202311202321/images/btnStart.png" />
<div class="num num1">
<div class="num-con num-con1">
<ul class="list">
<li class="item">0</li>
<li class="item">1</li>
<li class="item">2</li>
<li class="item">3</li>
<li class="item">4</li>
<li class="item">5</li>
<li class="item">6</li>
<li class="item">7</li>
<li class="item">8</li>
<li class="item">9</li>
</ul>
<ul class="list">
<li class="item">0</li>
<li class="item">1</li>
<li class="item">2</li>
<li class="item">3</li>
<li class="item">4</li>
<li class="item">5</li>
<li class="item">6</li>
<li class="item">7</li>
<li class="item">8</li>
<li class="item">9</li>
</ul>
</div>
</div>
<div class="num num2">
<div class="num-con num-con2">
<ul class="list">
<li class="item">0</li>
<li class="item">1</li>
<li class="item">2</li>
<li class="item">3</li>
<li class="item">4</li>
<li class="item">5</li>
<li class="item">6</li>
<li class="item">7</li>
<li class="item">8</li>
<li class="item">9</li>
</ul>
<ul class="list">
<li class="item">0</li>
<li class="item">1</li>
<li class="item">2</li>
<li class="item">3</li>
<li class="item">4</li>
<li class="item">5</li>
<li class="item">6</li>
<li class="item">7</li>
<li class="item">8</li>
<li class="item">9</li>
</ul>
</div>
</div>
<div class="num num3">
<div class="num-con num-con3">
<ul class="list">
<li class="item">0</li>
<li class="item">1</li>
<li class="item">2</li>
<li class="item">3</li>
<li class="item">4</li>
<li class="item">5</li>
<li class="item">6</li>
<li class="item">7</li>
<li class="item">8</li>
<li class="item">9</li>
</ul>
<ul class="list">
<li class="item">0</li>
<li class="item">1</li>
<li class="item">2</li>
<li class="item">3</li>
<li class="item">4</li>
<li class="item">5</li>
<li class="item">6</li>
<li class="item">7</li>
<li class="item">8</li>
<li class="item">9</li>
</ul>
</div>
</div>
</div>
</div>
<script src="https://www.jq22.com/jquery/jquery-1.10.2.js"></script>
<script src="https://www.jq22.com/demo/jqueryCj202311202321/js/index.js"></script>
</body>
</html>
页:
[1]