JSFiddle - React, Tailwind, and code Playground

by mazlix

HTML

<div class="msg">
     谢谢你!!
</div>
<textarea></textarea>

CSS

body {
    margin: auto;
    width:500px;
}
textarea {
    position:relative;
    margin-top:30px;
    width:400px;
    height:200px;
}
.msg {
    position:absolute;
    z-index:99999;
    background:#a9e823;
    width:400px;
    height:30px; /*SET THIS EQUAL to textarea's margin-top.. or almost */
}

JavaScript

$(".msg").slideUp(0);
    $("textarea").focus(function(){
        $(".msg").slideDown();
    });
    $("textarea").blur(function(){
        $(".msg").slideUp();
    });