Ir para conteúdo

lucascuri1

Members
  • Total de itens

    7
  • Registro em

  • Última visita

Reputação

0 Comum

Sobre lucascuri1

  1. lucascuri1

    Logo sobrepondo-se ao título

    Estou desenvolvendo uma página de cadastro responsiva, só que o logo e o título estão me dando muita dor de cabeça, já tentei de tudo que eu sei e não consegui arrumar, será que algum entendedor de css poderia me dar uma dica? Ele está ficando assim a partir de uns 500px. Desde já agradeço. Códigos: HTML - https://pastebin.com/g7tipa0E CSS - https://pastebin.com/w4yU95Hw Foto do problema:
  2. lucascuri1

    Posicionar logo e campos de formulário

    Estou desenvolvendo uma página de cadastro, e estou com problemas para posicionar o logo da página e os campos de formulário, queria que algum entendedor de CSS me explicasse a forma correta e mais fácil de se fazer essas duas coisas. Está como na primeira, e deve ficar como na segunda. HTML: <!DOCTYPE html> <html> <head> <title></title> <link rel="stylesheet" type="text/css" href="css/reset.css"> <style> body { font-family: 'Open Sans', sans-serif; } #header { background-color: #e0e80d; } #header-logo { padding-left: 50px; padding-top: 50px; } #titulo { text-align: center; position: relative; bottom: 70px; font-size: 24px; } #content { margin-top: 30px; } #camposCadastro { width: 60%; margin: 0 auto; } #camposCadastro input { padding: 10px; width: 25%; border-style: none; box-shadow: 0px 0.5px #888888; } #enviar { margin-left: 43%; padding: 15px; background-color: #b4bb07; border-style: none; border-radius: 4px; width: 15%; height: 50px; color: white; box-shadow: 1px 1px 1px #888888; } #footer { background-color: #e0e80d; margin-top: 303px; padding: 50px; display: flex; justify-content: center; } </style> <link href="https://fonts.googleapis.com/css?family=Open+Sans" rel="stylesheet"> </head> <body> <div id="header"> <div id="header-logo"> <img src="img/logo.png"> <h4>Social Network</h4> </div> </div> <h1 id="titulo">Cadastro</h1> <div id="content"> <form id="formulario"> <div id="camposCadastro"> <p> <label for="nome">Nome:</label><input type="text" name="nome" id="nome" placeholder="Digite aqui seu nome"> <label for="sbnome">Sobrenome:</label><input type="text" name="sbnome" id="sbnome" placeholder="Digite aqui seu sobrenome"> </p> <p> <label for="email">E-mail:</label><input type="email" name="email" id="email" placeholder="Digite aqui seu email"> <label for="idade">Idade:</label><input type="number" name="idade" id="idade" placeholder="Digite aqui sua idade"> <label for="cpf">CPF:</label><input type="number" name="cpf" id="cpf" placeholder="Digite aqui seu CPF"> </p> <p> <label for="cep">CEP:</label><input type="number" name="cep" id="cep" placeholder="Digite aqui seu cep"> <label for="endereco">Endereço:</label><input type="text" name="endereco" id="endereco" placeholder="Digite aqui seu endereço"> <label for="senha">Senha:</label><input type="password" name="senha" id="senha" placeholder="Digite aqui sua senha"> </p> </div> <input type="submit" name="enviar" id="enviar" value="ENVIAR"> </form> <div id="footer"> <p>Projeto Realiza Digital © 2017</p> </div> </div> </body> </html>
  3. Estou desenvolvendo um script e quero trocar a foto da cadeira conforme a pessoa digite o id da cadeira no input, no caso "banco1", ou "banco2", porém, quando eu fui fazer isso, tentei utilizar um banco[ i ].src = "banco2.jpg"; (ou banco.src[ i ], não sei qual o correto), mas tentei ambos e não funcionou. Alguém sabe como eu poderia mudar a imagem de acordo com o id que a pessoa digitou? <!DOCTYPE html> <html> <head> <title></title> <meta charset="utf-8"> </head> <body> <h1>Teatro Guarani - Show Papas da Língua</h1> <hr> <p>Poltrona:<input id="poltrona"> <button type="button" onclick="reservarPoltrona()">Reservar</button> </p> <hr> <div id="mapa" style="font-family: 'Courier New'; font-size: 10px"> <h3>Mapa do Teatro</h3> </div> <p>Legenda: </p> <h4> <img src="banco.jpg" style="width: 25px; height: 35px">Poltrona Disponível <img src="banco2.jpg" style="width: 25px; height: 35px">Poltrona Reservada </h4> <script> var aReserva = []; montarMapa(); function montarMapa() { for (i = 1; i <= 300; i++) { var sp = document.createElement("span"); var zeros = ""; if (i<10) { zeros = "00"; } else if (i<100) { zeros = "0"; } var num = document.createTextNode("["+zeros+i+"]"); if (i % 20 == 11) { sp.style.marginLeft = "100px"; } else { sp.style.marginLeft = "5px"; } sp.appendChild(num); document.getElementById("mapa").appendChild(sp); var banco = document.createElement("img"); banco.src = "banco.jpg"; document.getElementById("mapa").appendChild(banco); banco.style.width = "35px"; banco.style.height = "40px"; banco.id = "banco" + i; if (i % 20 == 0) { var br = document.createElement("br"); document.getElementById("mapa").appendChild(br); } } } function reservarPoltrona() { var poltrona = document.getElementById("poltrona").value; var banco = document.createElement("img"); aReserva.push(poltrona); if (poltrona == "" || isNaN(poltrona) || poltrona < 1 || poltrona > 300) { if (aReserva[i] == banco[i]) { banco.src = "banco2.jpg"; banco.style.width = "35px"; banco.style.height = "40px"; } } } </script> </body> </html>
  4. lucascuri1

    Trocar uma imagem através de um valor de um <input>

    Teria como fazer esse mesmo efeito de trocar a cadeira sem utilizar o "data"? Eu precisava fazer esse exercício utilizando especificamente um vetor :/
  5. lucascuri1

    Trocar uma imagem através de um valor de um <input>

    Teria alguma forma de fazer esse exercício utilizando o Javascript puro? Não conheço bem os elementos do Jquery.
  6. lucascuri1

    Trocar uma imagem através de um valor de um <input>

    Cara, ficou muito massa! Mas eu não consegui entender quase nada desse código :(. Também não entendi por que fizesses em um arquivo php e não no html que eu criei, ainda sou iniciante... Mas obrigado pela ajuda.
  7. Tenho o seguinte código: <!DOCTYPE html> <html> <head> <title></title> <meta charset="utf-8"> </head> <body> <h1>Teatro</h1> <hr> <p>Poltrona:<input id="poltrona"> <button type="button" onclick="reservarPoltrona()">Reservar</button> </p> <hr> <div id="mapa" style="font-family: 'Courier New'; font-size: 10px"> <h3>Mapa do Teatro</h3> </div> <p>Legenda: </p> <h4> <img src="banco.jpg" style="width: 25px; height: 35px">Poltrona Disponível <img src="banco2.jpg" style="width: 25px; height: 35px">Poltrona Reservada </h4> <script> var aReserva = []; montarMapa(); function montarMapa() { for (i = 1; i <= 300; i++) { var sp = document.createElement("span"); var zeros = ""; if (i<10) { zeros = "00"; } else if (i<100) { zeros = "0"; } var num = document.createTextNode("["+zeros+i+"]"); if (i % 20 == 11) { sp.style.marginLeft = "100px"; } else { sp.style.marginLeft = "5px"; } sp.appendChild(num); document.getElementById("mapa").appendChild(sp); var banco = document.createElement("img"); banco.src = "banco.jpg"; document.getElementById("mapa").appendChild(banco); banco.style.width = "35px"; banco.style.height = "40px"; banco.id = "banco" + i; if (i % 20 == 0) { var br = document.createElement("br"); document.getElementById("mapa").appendChild(br); } } } function reservarPoltrona() { var poltrona = document.getElementById("poltrona").value; aReserva.push(poltrona); if (poltrona == "" || isNaN(poltrona)) { alert("Informe os dados da reserva corretamente"); } else { } } </script> </body> </html> E tenho 3 tarefas: - Armazenar as reservas de poltrona no vetor aReserva; - Trocar a imagem da poltrona reservada (banco2.jpg) - aqui poderia ser qualquer imagem de poltrona, apenas para fazer a distinção das poltronas livres para as reservadas); - Impedir a reserva de poltronas ocupadas. Estou quebrando a cabeça para tentar resolver isso, e apesar de ser simples, não consigo. Estou recém começando a aprender sobre a DOM e ainda não domino nem 10% desses elementos, se pudessem ao menos me dar uma luz, eu ficaria muito grato.
×

Informação importante

Ao usar o fórum, você concorda com nossos Termos e condições.