JSFiddle - React, Tailwind, and code Playground

by marhaba

HTML

<div id="notify"></div>
<div id="content">
    <p>
        Biltong fatback flank, ball tip filet mignon jowl cow boudin pork belly beef ribs salami pastrami tri-tip. Frankfurter ball tip flank sausage, turkey pig short ribs pancetta rump. Chuck rump ham hock boudin sirloin, pork salami meatball biltong beef turducken drumstick ground round. Ribeye fatback pig meatloaf, shank pork flank pancetta capicola brisket corned beef boudin venison short loin. Cow salami tail, short ribs beef ribs swine andouille biltong meatloaf turducken. Salami shankle prosciutto, rump ham drumstick brisket turkey tenderloin. Salami shank pork loin, cow swine turkey jerky bacon rump turducken bresaola.
    </p>
    <p>
        Shoulder strip steak meatball capicola. Chuck hamburger shankle, jowl drumstick sirloin corned beef short loin salami. Andouille sirloin shankle, spare ribs corned beef bresaola venison leberkäse swine flank chicken meatloaf rump pork belly bacon. Pastrami chuck sirloin salami meatball, flank pork chop bacon swine cow pancetta prosciutto. Bacon biltong drumstick pork chop. Drumstick shoulder flank, brisket t-bone tenderloin meatloaf pork ribeye. Ribeye ham meatball, cow shank andouille turducken shankle salami tongue short loin filet mignon.
    </p><p>
    Tri-tip biltong shankle, pork loin turkey pig bresaola shoulder. Pork belly prosciutto sausage, shoulder frankfurter bresaola ham venison boudin swine. Boudin salami shank, pork shankle tri-tip meatball ribeye ball tip pancetta strip steak bresaola tenderloin t-bone chuck. Andouille filet mignon ham sirloin pork belly pancetta. Boudin prosciutto filet mignon, biltong sirloin ground round salami pork. Ham hock jowl frankfurter, brisket chicken corned beef venison ground round flank. Pork bacon prosciutto strip steak jowl pork loin.
    </p>
    <p>
        Pancetta shoulder beef pork belly, tail brisket shankle ham tenderloin bresaola tri-tip. Beef ribs pork chop jowl, tri-tip drumstick capicola rump corned beef...

CSS

#notify {
    position:relative;
    width:100%;
    background-color:orange;
    height:30px;
    color:white;
    display:none;
    text-align:center;
    padding:5px;
    font-size:2em;
    line-height:1em;
    font-family: Arial, sans-serif;
    border:2px solid #666;
    cursor:pointer;
}

JavaScript

$('#notify').click(function() {
    $(this).slideUp().empty();
});

$(function(){
    $('#notify').html('Welcome to the test page!').slideDown();
});