1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980 |
- <!DOCTYPE html>
- <html lang="en">
- <head>
- <meta charset="UTF-8">
- <title>领红包</title>
- <meta name="viewport" content="width=device-width,initial-scale=1.0">
- {{-- <script src="https://unpkg.com/axios/dist/axios.min.js"></script>--}}
- <style>
- *{
- padding: 0;
- margin: 0;
- }
- body{
- min-height: 100vh;
- background: url(https://cdn-novel.iycdm.com/distribution/welfare/background.jpg) top/100% no-repeat #a62656;
- }
- .active{
- position: absolute;
- width: 32vw;
- height: 32vw;
- top: 70VW;
- left: 35vw;
- }
- .result img{
- width: 80vw;
- display: block;
- margin: 30vw auto 0;
- }
- .result{
- position: absolute;
- top: 0;
- left: 0;
- width: 100vw;
- height: 100vh;
- background: rgba(0,0,0,0.7);
- }
- .hide{
- display: none;
- }
- .text{
- position: absolute;
- text-align: center;
- font-size: 5vw;
- width: 100%;
- top: 80vw;
- color: #333;
- font-weight: bold;
- }
- .amount{
- color: #FF0016;
- font-size: 10vw;
- vertical-align: -1vw;
- }
- </style>
- </head>
- <body>
- <div class="active"></div>
- <div class="prize hide result">
- <img src="https://cdn-novel.iycdm.com/distribution/welfare/get.png" >
- <p class="text"><span class="amount">{{$amount}}</span> <span>元红包</span></p>
- </div>
- <div class="no-prize hide result">
- <img src="https://cdn-novel.iycdm.com/distribution/welfare/over.png" >
- </div>
- <script>
- var options = {!! $options!!};
- document.querySelector('.active').addEventListener('click',function () {
- if(options.is_access) {
- //axios()
- document.querySelector('.prize').className = 'prize result'
- }else{
- document.querySelector('.no-prize').className = 'no-prize result'
- }
- })
- </script>
- </body>
- </html>
|