这个是在移动端上处理的一个刮奖小Demo
直接上完整代码
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta name="format-detection" content="telephone=no"> <meta name="viewport" content="user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width"> <style type="text/css"> #guaJiang .bjc { color: black; height: 70px; width: 240px; text-align: center; line-height: 70px; font-size: 20px; position: absolute; top: 300px; left: 60px; background-image: url(img/4-01.png); background-repeat: no-repeat; background-size: 18px 18px; background-position: 80% 53% } #guaJiang .guaCanvas { z-index: 3; position: absolute; top: 300px; left: 60px } </style> <title>网红</title> </head> <body > <div id='guaJiang'> <div class='bjc'>萌赚送你1.5</div> <canvas id="myCanvas" class='guaCanvas' width="240" height="70"></canvas> </div> </body> </html> <!DOCTYPE html> <html>
