Ankündigung

Einklappen
Keine Ankündigung bisher.

Hilfe zu PHP/HTML Formular gesucht

Einklappen

Neue Werbung 2019

Einklappen
Dieses Thema ist geschlossen.
X
X
  • Filter
  • Zeit
  • Anzeigen
Alles löschen
neue Beiträge

  • Hilfe zu PHP/HTML Formular gesucht

    Moin,
    auch wenn es sich nicht zu 100 % um PHP dreht, denke ich, dass hier einige Leute mit Erfahrung in diesem Bereich sind
    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-Code:
    <!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>
    sowie das Stylesheet dazu:

    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);
    }

  • #2
    Crossposting: https://www.html.de/threads/hilfe-zu...0/#post-395269
    Die Deutsche Rechtschreibung ist Freeware! Du darfst sie kostenlos nutzen, allerdings ist sie nicht Open Source, d.h. Du darfst sie nicht verändern oder in veränderter Form veröffentlichen.

    Kommentar


    • #3
      [MOD: geschlossen]
      Competence-Center -> Enjoy the Informatrix
      PHProcks!Einsteiger freundliche TutorialsPreComposed Packages

      Kommentar

      Lädt...
      X