JSFiddle - React, Tailwind, and code Playground

by Alex Alex

HTML

<form action="#" method="post">
    <input type="submit" name="svar" value="Svar" id="indholdcklik" class="click svarpm" />
</form>

<div id="indholdbeksed">
hey
</div>

CSS

#indholdbeksed {
    display: none;
    margin: 10px 0px;
}
.click {
    font-weight: bold;
    color: #ffffff;
    background: #79bbff;
    background: -moz-linear-gradient(top, #79bbff 0%, #4197ee 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#79bbff), color-stop(100%,#4197ee));
    background: -webkit-linear-gradient(top, #79bbff 0%,#4197ee 100%);
    background: -o-linear-gradient(top, #79bbff 0%,#4197ee 100%);
    background: -ms-linear-gradient(top, #79bbff 0%,#4197ee 100%);
    background: linear-gradient(to bottom, #79bbff 0%,#4197ee 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#79bbff', endColorstr='#4197ee',GradientType=0 );
}
.click:hover {
    background: #4197ee;
    background: -moz-linear-gradient(top,  #4197ee 0%, #79bbff 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#4197ee), color-stop(100%,#79bbff));
    background: -webkit-linear-gradient(top,  #4197ee 0%,#79bbff 100%);
    background: -o-linear-gradient(top,  #4197ee 0%,#79bbff 100%);
    background: -ms-linear-gradient(top,  #4197ee 0%,#79bbff 100%);
    background: linear-gradient(to bottom,  #4197ee 0%,#79bbff 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#4197ee', endColorstr='#79bbff',GradientType=0 );
}

JavaScript

$(function () {
    $("#indholdcklik").click(function() {
        $("#indholdbeksed").slideDown("slow",function() {
            // Animation complete.
        });
        return false;
    });
});