Transition en fondu entrant et sortant pour la boîte de connexion

Je veux faire apparaître ma boîte de connexion au chargement de la page et/ou à la sortie de la page si possible ... J'ai essayé d'examiner d'autres réponses de dépassement de pile, mais aucune ne semble travailler pour mon codeTransition en fondu entrant et sortant pour la boîte de connexion

HTML:

<?php 
    if(isset($_POST["submit"])) { 
     $link = mysqli_connect("localhost","root",""); 
     mysqli_select_db($link,"test"); 
     $count = 0; 
     $res=mysqli_query($link,"SELECT * FROM users WHERE username='$_POST[Username]' && password='$_POST[Password]'"); 
     $count=mysqli_num_rows($res); 
     if($count > 0) { 
      ?> 
      <script type="text/javascript"> 
      window.location="index.php"; 
      </script> 
      <?php 
     } 
    } 
?> 
<!DOCTYPE html> 
<html> 
<head> 
<link rel="stylesheet" type="text/css" href="stylesheet.css"> 
<link href="https://fonts.googleapis.com/css?family=PT+Sans" rel="stylesheet"> 

</head> 
<body> 
    <div id = "log"> 
     <form autocomplete="off" method="post" action="login.php"> 
     <p>Username:</p> <input class="inputbox" type="text" name="Username" /> 
     <p>Password:</p> <input class="inputbox" type="password" name ="Password" /> 
     <br><br> 
     <input id = "submitbutton" type="submit" name="submit" value="Login" />    <br> 
    </div> 
    </div> 
</body> 
</html>

merci à l'avance

Source

2017-02-06 FGlitch

pour effacer dans le chargement de la page, vous pouvez utiliser une animation simple CSS

form { 
 
    animation: fadeIn .5s forwards; 
 
    animation-delay: 1s; /* optional */ 
 
    opacity: 0; 
 
} 
 

 
@keyframes fadeIn { 
 
    to { 
 
    opacity: 1; 
 
    } 
 
}

<form autocomplete="off" method="post" action="login.php"> 
 
    <p>Username:</p> <input class="inputbox" type="text" name="Username" /> 
 
    <p>Password:</p> <input class="inputbox" type="password" name="Password" /> 
 
    <br><br> 
 
    <input id="submitbutton" type="submit" name="submit" value="Login" /> 
 
</form>

Source

2017-02-06 02:12:24

merci @ Michael – FGlitch

@FGlitch vous êtes les bienvenus :) –

Transition en fondu entrant et sortant pour la boîte de connexion

Répondre

Questions connexes