Miguel Luís 0 Denunciar mensagem Publicado 29 de Maio (editado) Ola estou montando um quiz(perguntas e respostas), trabalho simples mas um pouco complicado para um novato estou querendo montar do seguinte jeito: Vai começar o QUIZ, vai ler a pergunta e por uma resposta, mas quando ela clicar na resposta, por exemplo se ela ou ele acertar o botão vai ficar verde e da um tempo de 3s e passa para a próxima, se ela ou ele erra vai ficar vermelho e depois vai aparecer a resposta certa que vai ficar verde e depois ir para a próxima pergunta por favor me ajudem o prozo é curto Editado 29 de Maio por Miguel Luís Partilhar esta mensagem Ligação para a mensagem Partilhar noutros sites
HappyHippyHippo 1177 Denunciar mensagem Publicado 29 de Maio O que já tens feito? IRC : sim, é algo que ainda existe >> #p@p Portugol Plus Partilhar esta mensagem Ligação para a mensagem Partilhar noutros sites
Miguel Luís 0 Denunciar mensagem Publicado 29 de Maio (editado) 16 horas atrás, Miguel Luís disse: Ola estou montando um quiz(perguntas e respostas), trabalho simples mas um pouco complicado para um novato estou querendo montar do seguinte jeito: Vai começar o QUIZ, vai ler a pergunta e por uma resposta, mas quando ela clicar na resposta, por exemplo se ela ou ele acertar o botão vai ficar verde e da um tempo de 3s e passa para a próxima, se ela ou ele erra vai ficar vermelho e depois vai aparecer a resposta certa que vai ficar verde e depois ir para a próxima pergunta por favor me ajudem o prozo é curto 10 horas atrás, HappyHippyHippo disse: O que já tens feito? Bom, primeiramente obrigado por me atender,eu não sei bem como fazer pois sou novo na área de informatica e desenvolvimento web, mas gostaria de tentar. Eu consegui fazer só a estilização das perguntas com CSS. O QUIZ que estou projetando ira funcionar da seguinte maneira: É uma pegunta por pagina, se a pessoa clicar na resposta certa, a resposta ira ficar verde por uns 3 segundos para der tempo de visualizar e depois iria para próxima pergunta, caso a pessoa clicar na resposta erada ira ficar vermelho por 3 segundos e também iria para a próxima pergunta. Não sei se da para fazer em CSS dentro do PHP ou só com CSS. me ajude por favor, e se der me mostre um exemplo.Obrigado Editado 29 de Maio por Miguel Luís Partilhar esta mensagem Ligação para a mensagem Partilhar noutros sites
HappyHippyHippo 1177 Denunciar mensagem Publicado 30 de Maio agora faz aparecer as perguntas dica : leva o projecto devagar e por passos pequenos IRC : sim, é algo que ainda existe >> #p@p Portugol Plus Partilhar esta mensagem Ligação para a mensagem Partilhar noutros sites
Miguel Luís 0 Denunciar mensagem Publicado 30 de Maio Parte PHP-HTML <!DOCTYPE html> <html lang="pt-br"> <head> <meta charset="utf-8"> <link rel="stylesheet" type="text/css" href="conf.css"> <title></title> </head> <body> <form action="" method="GET"> <div id="margin"> <h1 style="height: 120px;">Pergunta<br> Hannah, Alex e Jessica ?</h1> <ul> <li id="prim" class="res01"> <a href="pergunta2.php"> <p id="res1">Resposta 1</p> </a> </li> <li> <a href="pergunta2.php"> <p id="res2">Resposta 2</p> </a> </li> <li> <a href="pergunta2.php"> <p id="res3" >Resposta 3</p> </a> </li> <li> <a href="pergunta2.php"> <p id="res4">Resposta 4</p> </a> </li> </ul> </div> </form> </body> </html> parte CSS body{ background-image: url("imagensquiz/figura7.jpg"); background-repeat: no-repeat; background-size: 100% 150%; } #margin { height: 570px; width: 500px; margin-left: 450px; margin-right: 100px; margin-top: 30px; background-color: rgb(243,243,243); display: inline-block; border-radius: 20px; box-shadow: 2px 2px 50px #FFFFFF; border: 2px solid black; } h1{ font-family: Insaniburger; font-size: 30px; text-align: center; margin-top: 10px; margin-left: 25px; background-color: black; color: rgb(242,242,242); height: 150px; width: 450px; border-radius: 10px; border: 2px solid black; text-shadow: 1px 1px 20px #F01515; } #prim{ margin-top: 60px; } ul li{ list-style: none; margin-top: 15px; background-color: #FFFFFF; margin-left: 55px; margin-right: 500px; text-align: center; text-shadow: 1px 1px 3px black; border-radius: 20px; height: 50px; width: 300px; border: 5px solid #1F1C1C; box-shadow: 1px 1px 18px black; } ul li:hover{ background-color: black; color: white; } p:hover{ text-decoration:underline #F9F611; color: white; text-shadow: 1px 1px 10px #F01515; } p{ text-decoration: none; font-size: 30px; margin-top: 5px; font-family: Insaniburger; color: #F01515; text-decoration-line: inline-block; } a{ text-decoration-line:none; animation-name: time; animation-duration: 50s; } #O de baixo não funciona direito Por exemplo ele ele inicia direito eu quero que clique e dai altere a cor e passe para a próxima pergunta @keyframes time:hover{ 0% { background: #dc34ce; animation-duration: 2s; } 100% { background: #0EB5F3; animation-duration: 2s; } } .res01{ animation-name: time; animation-duration: 50s; } Partilhar esta mensagem Ligação para a mensagem Partilhar noutros sites
