JSFiddle - React, Tailwind, and code Playground
HTML
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>jQuery</title>
<script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
</head>
<body>
<div id="morefenster">
<p>Lorem ipsum dolor sit amet,........</p>
</div>
<div id="more">More</div>
</body>
</html>
CSS
#more {
width:800px;
height:20px;
background:green;
color:white;
position:absolute;
top:0px;
left:50%;
margin-left:-400px;
font-size:16px;
font-weight:bold;
cursorointer;
text-align:center;
}
#morefenster {
width:800px;
background:green;
position:absolute;
top:20px;
left:50%;
margin-left:-400px;
display:none;
}
#morefenster p {
color:white;
padding:15px;
text-align:justify;
}
JavaScript
$(document).ready(function () {
$("#more").click(function () {
$("#morefenster").slideToggle("slow");
});
});