JSFiddle - React, Tailwind, and code Playground
HTML
<div class="nad_p_igra">
<h3>Frank 'n' Slime...</h3>
<p class="p_igra">
Razrešite platformo sestavljank. Pri reševanju preko 30-tih možgansko zahtevnih stopnjah, vas bo spremljal pripovedovalec. </p>
<p class="p_igra_tipke">
smerne tipke, klik z miško na puščice za spremembo gravitacije, preslednica - sprememba lika
</p>
</div>
CSS
.p_igra, .p_igra_tipke {
display: none;
}
h3 {
cursor: pointer;
}
JavaScript
$(document).ready(function(){
$("h3").click(function(){
if($(".p_igra, .p_igra_tipke").is(":hidden")) {
$(this).nextAll().toggle(600); // this=h3, all the following sibling objects...
$(this).css("color","#ffda88");
$(this).text(function () {
return $(this).text().replace("...", ""); // odstrani tri pike
});
} else {
$(this).nextAll().toggle(600); // this=h3, all the following sibling objects...
$(this).append("..."); //tole dodaj :)
$(this).css("color","#e4e4e4");
}
});
});