Ir para conteúdo
Fórum Script Brasil

Ariani Alves

Membros
 Perfil  Explorar Conteúdo

  • Total de itens

    2

  • Registro em

  • Última visita

 Tipo de Conteúdo 

Tudo que Ariani Alves postou

  1. Ariani Alves
    Estou com dificuldades em inserir uma url de imagem no bg da minha raspadinha interativa. Meu código está assim: <!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width" /> <link href='https://fonts.googleapis.com/css?family=Open+Sans:400,300,300italic,400italic,600,600italic,700italic,700' rel='stylesheet' type='text/css'> <title>Scratch Card</title> <style type="text/css"> html { box-sizing: border-box; } *, *:before, *:after { box-sizing: inherit; } .scratchpad{ width: 450px; height: 445px; border: solid 10px #FFFFFF; margin:0 auto; } body { background:#efefef; } .scratch-container { -webkit-touch-callout: none; -webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; width:100%; } @media only screen and (max-width : 480px) { .scratchpad {width:400px;height:396px;} .scratch-container {width:400px !important;} } /* Custom, iPhone Retina */ @media only screen and (max-width : 320px) { .scratchpad {width:290px;height:287px;} .scratch-container {width:290px !important;} } .promo-container { background:#FFF; border-radius:5px; -moz-border-radius:5px; -webkit-border-radius:5px; width:450px; padding:20px; margin:0 auto; text-align:center; font-family:'Open Sans', Arial,Sans-serif; color:#333; font-size:16px; margin-top:20px; } .btn { background:#56CFD2; color:#FFF; padding:10px 25px; display:inline-block; margin-top:15px; text-decoration:none; font-weight:600; text-transform:uppercase; border-radius:3px; -moz-border-radius:3px; -webkit-border-radiuss:3px; } </style> </head> <body> <div class="scratch-container"> <div id="promo" class="scratchpad"></div> </div> <div class="promo-container" style="display:none;"> <div class="promo-code"></div> <a href="htttp://jennamolby.com" target="_blank" class="btn">Register Now</a> </div> <script src="https://code.jquery.com/jquery-latest.min.js" type="text/javascript"></script> <script type="text/javascript" src="https://jennamolby.com/scratch-and-win/js/wScratchPad.min.js"></script> <script type="text/javascript"> var promoCode = ''; var bg1 = 'Imagens/Gpay_Card 1.jpg'; var bg2 = 'Imagens/Gpay_Card 2.jpg'; var bg3 = 'Imagens/Gpay_Card 3.jpg'; var bg4 = 'Imagens/Gpay_Card 4.jpg'; var bgArray= [ bg1, bg2, bg3, bg4 ], selectBG = bgArray[Math.floor(Math.random() * bgArray.length)]; if (selectBG == bg1) { promoCode = 'SCRATCH400'; } else if (selectBG == bg2) { promoCode = 'SCRATCH500'; } if (selectBG == bg3) { var promoCode = ''; } $('#promo').wScratchPad({ // the size of the eraser size : 70, // the randomized scratch image bg: selectBG, // give real-time updates realtime : true, // The overlay image fg: 'https://i.ibb.co/NCTRZVN/Gpay-Card-1.jpg', // The cursor (coin) image 'cursor': 'url("https://jennamolby.com/scratch-and-win/images/coin1.png") 5 5, default', scratchMove: function (e, percent) { // Show the plain-text promo code and call-to-action when the scratch area is 50% scratched if ((percent > 50) && (promoCode != '')) { $('.promo-container').show(); $('body').removeClass('not-selectable'); $('.promo-code').html('Your code is: ' + promoCode); } } }); </script> </body> </html> Preciso que esses valores : var promoCode = ''; var bg1 = 'Imagens/Gpay_Card 1.jpg'; var bg2 = 'Imagens/Gpay_Card 2.jpg'; var bg3 = 'Imagens/Gpay_Card 3.jpg'; var bg4 = 'Imagens/Gpay_Card 4.jpg'; Sejam substituidos por uma url de imagem. Sou nova no ramo, se alguém puder me auxiliar fico muito grata.
  2. Ariani Alves
    Olá, amigxs! Estou desenvolvendo uma raspadinha interativa que pretendo enviar por email marketing utilizando o mailchimp. Porém estou com uma imensa dificuldade em adicionar a imagem bg por meio de link. Sou nova no ramo então estou pedida. Se alguém puder me ajudar fico imensamente grata. Meu código está assim: <!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width" /> <link href='https://fonts.googleapis.com/css?family=Open+Sans:400,300,300italic,400italic,600,600italic,700italic,700' rel='stylesheet' type='text/css'> <title>Scratch Card</title> <style type="text/css"> html { box-sizing: border-box; } *, *:before, *:after { box-sizing: inherit; } .scratchpad{ width: 450px; height: 445px; border: solid 10px #FFFFFF; margin:0 auto; } body { background:#efefef; } .scratch-container { -webkit-touch-callout: none; -webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; width:100%; } @media only screen and (max-width : 480px) { .scratchpad {width:400px;height:396px;} .scratch-container {width:400px !important;} } /* Custom, iPhone Retina */ @media only screen and (max-width : 320px) { .scratchpad {width:290px;height:287px;} .scratch-container {width:290px !important;} } .promo-container { background:#FFF; border-radius:5px; -moz-border-radius:5px; -webkit-border-radius:5px; width:450px; padding:20px; margin:0 auto; text-align:center; font-family:'Open Sans', Arial,Sans-serif; color:#333; font-size:16px; margin-top:20px; } .btn { background:#56CFD2; color:#FFF; padding:10px 25px; display:inline-block; margin-top:15px; text-decoration:none; font-weight:600; text-transform:uppercase; border-radius:3px; -moz-border-radius:3px; -webkit-border-radiuss:3px; } </style> </head> <body> <div class="scratch-container"> <div id="promo" class="scratchpad"></div> </div> <div class="promo-container" style="display:none;"> <div class="promo-code"></div> <a href="htttp://jennamolby.com" target="_blank" class="btn">Register Now</a> </div> <script src="https://code.jquery.com/jquery-latest.min.js" type="text/javascript"></script> <script type="text/javascript" src="https://jennamolby.com/scratch-and-win/js/wScratchPad.min.js"></script> <script type="text/javascript"> var promoCode = ''; var bg1 = 'Imagens/Gpay_Card 1.jpg'; var bg2 = 'Imagens/Gpay_Card 2.jpg'; var bg3 = 'Imagens/Gpay_Card 3.jpg'; var bg4 = 'Imagens/Gpay_Card 4.jpg'; var bgArray= [ bg1, bg2, bg3, bg4 ], selectBG = bgArray[Math.floor(Math.random() * bgArray.length)]; if (selectBG == bg1) { promoCode = 'SCRATCH400'; } else if (selectBG == bg2) { promoCode = 'SCRATCH500'; } if (selectBG == bg3) { var promoCode = ''; } $('#promo').wScratchPad({ // the size of the eraser size : 70, // the randomized scratch image bg: selectBG, // give real-time updates realtime : true, // The overlay image fg: 'https://i.ibb.co/NCTRZVN/Gpay-Card-1.jpg', // The cursor (coin) image 'cursor': 'url("https://jennamolby.com/scratch-and-win/images/coin1.png") 5 5, default', scratchMove: function (e, percent) { // Show the plain-text promo code and call-to-action when the scratch area is 50% scratched if ((percent > 50) && (promoCode != '')) { $('.promo-container').show(); $('body').removeClass('not-selectable'); $('.promo-code').html('Your code is: ' + promoCode); } } }); </script> </body> </html>
×
×
  • Criar Novo...