wanderval
-
Total de itens
412 -
Registro em
-
Última visita
-
Dias vencidos
2
Tudo que wanderval postou
-
O que achei estranho no seu código é que no seu for você esta colocando 1 array dentro de outro, o que não entendi afinal quando você usa o push você já está adicionando o array dentro de outro: let linhas = []; for(let i = 0 ; i < 18; i ++){ linhas.push([0, 1 , i]); } console.log(linhas); Output: [[0, 1, 0], [0, 1, 1], [0, 1, 2], [0, 1, 3], [0, 1, 4], [0, 1, 5], [0, 1, 6], [0, 1, 7], [0, 1, 8], [0, 1, 9], [0, 1, 10], [0, 1, 11], [0, 1, 12], [0, 1, 13], [0, 1, 14], [0, 1, 15], [0, 1, 16], [0, 1, 17]] jsbin: https://jsbin.com/yubimahada/edit?html,js,console,output
-
Da uma olhada nesse código: Html: <div role="tabpanel" class="tab-pane" id="avaliacao"> <div style="padding-top:20px;"> <form class="form-horizontal" action="" method="POST"> <div class="form-row"> <div class="form-group col-md-2"> <label for="peso">Peso</label> <input id="peso" type="text" name='peso' class="form-control" placeholder="Peso"> </div> <div class="form-group col-md-2"> <label for="altura">Altura</label> <input id="altura" type="text" name='altura' class="form-control" placeholder="Altura em metros"> </div> <div class="form-group col-md-2"> <label for="imc">IMC</label> <input id="imc" type="text" name='imc' class="form-control" placeholder="IMC"> </div> <div class="form-group col-md-2"> <label for="rcq">Relação Cintura Quadril</label> <input id="rcq" type="text" name='rcq' class="form-control" placeholder="RCQ"> </div> </div> </form> </div> </div> JS: function getElement(el) { return document.getElementById(el); } function validToCalc(fieldWeight, fieldHeight) { return fieldWeight.value && fieldHeight.value; } function calcImc(fieldWeight, fieldHeight) {console.log(fieldWeight, fieldHeight) const parsedWeigth = parseFloat(fieldWeight.replace(',', '.')); const parsedHeight = parseFloat(fieldHeight.replace(',', '.')); const calculatedImc = parsedWeigth/(parsedHeight * parsedHeight); return Math.round(calculatedImc.toFixed(2)); } function initCalc(fieldWeight, fieldHeight) { const imcResult = calcImc(fieldWeight.value, fieldHeight.value); setImc(imcResult); } function setImc(imcResult) { getElement('imc').value = imcResult; } window.onload = function() { const fieldWeight = getElement('peso'); const fieldHeight = getElement('altura'); fieldWeight.addEventListener('keyup', function() { if(validToCalc(fieldWeight, fieldHeight)) { initCalc(fieldWeight, fieldHeight); } }); fieldHeight.addEventListener('keyup', function(){ if(validToCalc(fieldWeight, fieldHeight)) { initCalc(fieldWeight, fieldHeight); } }); } Jsbin: https://jsbin.com/woluponofe/edit?html,js,console,output
-
O erro no seu código e que você não manipula a variável que é incrementada pra exibir o estado da questão atual: Before: function backQ(){ loadquestion(); i = i - 1; // ainda não entendi pq decrementou depois de carregar } After: function backQ(){ i = i - 1; numQ = i; loadquestion(); } JsBin: https://jsbin.com/zobofakija/edit?html,js,output PS: Seu html tá triste precisa estudar CSS aqueles "<br>" da um certo desgosto você colocou dentro do <head> todo o código e não está se preocupando com os espaçamentos tornado seu código sujo e seu Javascript tem que começar a pensar em reaproveitar código. fiz um outro código com um refactor: i = 0; var pontos = 0; var numQ = 1; var myqs = [ ["Clique na foto 3 ?","img3.gif", "img2.gif","img1.gif","img1a.gif","3"], ["Clique na foto 2 ?","icone.png","icone2.png","certo.png","certo.png","2"], ["Clique na foto 4","icone.png","errado.png","certo.png","certo.png","4"] ]; function initApp() { setValue('next', 'Próximo'); setBackground('next', 'lightgray'); loadQuestion(); } function loadQuestion(numQ = 1) { setContent('mylabel', myqs[i][0]); setImagesOnBox(); updateStateQuestion(numQ); defaultStateBox(); clearMessage('erro'); } function setImagesOnBox() { const targetList = ['btn0', 'btn1', 'btn2', 'btn3']; targetList.forEach((item, index) => setSrc(item, myqs[i][index+1])); } function updateStateQuestion(numQ) { setContent("numQ", "Questão " + numQ + " de " + myqs.length); } function defaultStateBox() { const targetList = ['imgbox1', 'imgbox2', 'imgbox3', 'imgbox4']; targetList.forEach(item => setBackground(item, 'white')); } function nextQuestion(){ i = i + 1; numQ = numQ + 1; loadQuestion(numQ); } function backQuestion(){ i = i - 1; numQ = numQ - 1; loadQuestion(numQ); } function checkans(a){ clearMessage('erro'); respostas = parseInt(myqs[i][5]); if(respostas === a){ pontos++; setContent("pontos", "Você acertou " + pontos); setBackground("imgbox"+respostas, "#99ff99"); } else { showIncorrectMessage(); } } function clearMessage(fieldId) { setContent(fieldId, ""); setColor(fieldId, ""); } function showIncorrectMessage() { setContent("erro", "Incorreta"); setColor("erro", "red"); } // Utils methods function refElement(fieldId) { return document.getElementById(fieldId); } function setValue(fieldId, value) { refElement(fieldId).value = value; } function setContent(fieldId, content) { refElement(fieldId).innerHTML = content; } function setBackground(fieldId, color) { refElement(fieldId).style.backgroundColor = color; } function setColor(fieldId, color) { refElement(fieldId).style.color = color; } function setSrc(fieldId, pathFile) { refElement(fieldId).src = pathFile; } Jsbin: https://jsbin.com/buduwibade/1/edit?html,js,output Removendo os <br>: https://jsbin.com/hiloxogufu/1/edit?html,css,output
-
o que eu faria é usar position: HTML <div class="container"> <div class="caption"> <label>CONFIGURAÇÕES</label> <p>Describe something here to make sense for user who will go read this text</p> </div> </div> CSS .container { width: 230px; height: 230px; background: purple; position: relative; overflow: hidden; } .caption { background: rgba(0,0,0,0.3); height: 100%; font-size: 18px; font-family: arial; color: #fff; position: absolute; bottom: -170px; transition: 1s; } .caption label { display: block; margin-bottom: 60px; } .caption:hover { bottom: 0; transition: 1s; } link demo: https://jsfiddle.net/wanderval/hczjgpeu/21/