• Jetzt anmelden. Es dauert nur 2 Minuten und ist kostenlos!

Frage Hilfe zu PHP/HTML Formular gesucht

StamE.

Neues Mitglied
Moin,
auch wenn es sich nicht zu 100 % um PHP dreht, denke ich, dass hier einige Leute mit Erfahrung in diesem Bereich sind
smile.png

Nun, ich habe ein Formular erstellt und würde gerne dieses per animierten Button, über POST weitergeben.
Jetzt habe ich dass Problem, dass mir die Animation nicht angezeigt wird, warum auch immer ...
Ich hoffe einer von Euch kann mir bei diesem kleinen Problem weiterhelfen:
HTML:
HTML:
<!DOCTYPE html>
<html>
    <head>
        <link rel="stylesheet" type="text/css" href="style.css">
    </head>
    <body>
        <div id="std_box">
            <div id="bild">
                <img class="Privat" src="Privat"><br>
            </div><hr><br>
            <div id="anmeldung">
                <form action="datenbank.php" method="post">
                    <input placeholder="Benutzername" type="text" name="user"><br>
                    <input placeholder="Passwort" type="password" name="pw"><br><br>
                    <input type="submit" value="Login" class="animated-button victoria-two">
                </form>
            </div>
        </div>
    </body>
</html>
CSS:
Code:
@charset=utf-8;

hr
    {
    width: 100%;
    float: left;
    display:block;
    border:none;
    color:white;
    height:1px;
    background:black;
    background: -webkit-gradient(radial, 50% 50%, 0, 50% 50%, 350, from(#000), to(#fff));
    }

img {
    display: block;
    margin-left: auto;
    margin-right: auto;
    }

#std_box
    {
    margin: auto;
    width: 60%;
    padding: 10px;
    }

#bild
    {
    margin: auto;
    width: 60%;
    padding: 10px;
    }

#anmeldung
    {
    text-align: center;
    margin: auto;
    width: 60%;
    padding: 10px;
    }


/* Global Button Styles */
input.animated-button:link, input.animated-button:visited {
    position: relative;
    display: block;
    margin: 10px auto 0;
    padding: 10px 10px;
    color: black;
    font-size:14px;
    font-weight: bold;
    text-align: center;
    text-decoration: none;
    text-transform: uppercase;
    overflow: hidden;
    letter-spacing: .08em;
    border-radius: 0;
    text-shadow: 0 0 1px rgba(0, 0, 0, 0.2), 0 1px 0 rgba(0, 0, 0, 0.2);
    -webkit-transition: all 1s ease;
    -moz-transition: all 1s ease;
    -o-transition: all 1s ease;
    transition: all 1s ease;
}
input.animated-button:link:after, input.animated-button:visited:after {
    content: "";
    position: absolute;
    height: 0%;
    left: 50%;
    top: 50%;
    width: 150%;
    z-index: -1;
    -webkit-transition: all 0.75s ease 0s;
    -moz-transition: all 0.75s ease 0s;
    -o-transition: all 0.75s ease 0s;
    transition: all 0.75s ease 0s;
}
input.animated-button:link:hover, input.animated-button:visited:hover {
    color: #FFF;
    text-shadow: none;
}
input.animated-button:link:hover:after, input.animated-button:visited:hover:after {
    height: 450%;
}
input.animated-button:link, input.animated-button:visited {
    position: relative;
    display: block;
    margin: 30px auto 0;
    padding: 14px 15px;
    color: black;
    font-size:14px;
    border-radius: 0;
    font-weight: bold;
    text-align: center;
    text-decoration: none;
    text-transform: uppercase;
    overflow: hidden;
    letter-spacing: .08em;
    text-shadow: 0 0 1px rgba(0, 0, 0, 0.2), 0 1px 0 rgba(0, 0, 0, 0.2);
    -webkit-transition: all 1s ease;
    -moz-transition: all 1s ease;
    -o-transition: all 1s ease;
    transition: all 1s ease;
}

/* Victoria Buttons */

input.animated-button.victoria-two {
    border: none;
}
input.animated-button.victoria-two:after {
    background: #005BAA;
    -moz-transform: translateX(-50%) translateY(-50%) rotate(25deg);
    -ms-transform: translateX(-50%) translateY(-50%) rotate(25deg);
    -webkit-transform: translateX(-50%) translateY(-50%) rotate(25deg);
    transform: translateX(-50%) translateY(-50%) rotate(25deg);
}
 
Werbung:
input.animated-button:link steht in deiner CSS. Wo ist denn der Link dazu?
Kann das sein, das da noch irgendwas fehlt?

Kannst du mal zeigen, wie das aussehen soll?
Da ich dein Endergebnis nicht kenne ,habe ich mal ein Beispiel mit einen Teil deiner Einstellungen gemacht.
Damit du siehst, wie man das mit dein Link anders machen kannst.



Musst du natürlich auf dein Code dann anwenden und ändern
 
Zuletzt bearbeitet:
Werbung:
Zurück
Oben