JSFiddle - React, Tailwind, and code Playground

by Mr sogata

HTML

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
<center>
        <div id="panel" style="width: 500px; height:auto; border: solid 1px">
            <h3>LOGIN FORM</h3>
            Username : <input id="username" type="text"><br><br>
            Password : <input id="pwd" type="password"><br><br>
            <button id="submit">TEST</button>
        </div>
    </center>

JavaScript

$(document).ready(function(){
           
            $("#submit").click(function(){
                var user=$("#username").val();
                var pwd=$("#pwd").val();
                if(user!="sogata"&&pwd!="1234"){
                    $( "#panel" ).effect( "shake", { direction: "right", times: 4, distance: 10}, 1000);
                }
                else{
                    alert("the username and password is correct")
                }
                
            });
        });