JSFiddle - React, Tailwind, and code Playground

by tylermwashburn

HTML

<!DOCTYPE html>
<html>
    <head>
    </head>
    <body>
        <span id="button">Adventure Time! :D</span>
        <div id="navigation">
            <a href="http://google.com/">Lulz</a>
        </div>
    </body>
</html>

CSS

body {
    font-family: Sans-Serif;
}

#button {
    background-color: #f67d04;
    
    border-radius: 7px;
    
    padding: 5px;
}
#navigation {
    background-color: #f62886;
    
    border-radius: 7px;
    
    display: none;
    
    height: 200px;
    
    padding: 5px;
    
    width: 300px;
}

JavaScript

$(document).ready(function () {
    $('#button').hover(function () {
        $('#navigation').slideToggle();
    });
});