Anonymní profil peter – Programujte.com
 x   TIP: Přetáhni ikonu na hlavní panel pro připnutí webu

Anonymní profil peter – Programujte.comAnonymní profil peter – Programujte.com

 

Příspěvky odeslané z IP adresy 2001:718:2601:258:996c:42...–

peter
CSS › Rozbalovací parametry produktu
9. 10. 2017   #218090

No, a zkousel jsi to googlovat? Mi prijde obcas, ze tu ucim deti googlovat :)
google = javascript show more example
javascript show more jquery

https://css-tricks.com/forums/topic/jquery-read-more-less-toggle/
->
https://codepen.io/…/bqLaJm ;

<style>
.read-more-content {
  max-height: 0;
  overflow: hidden;
  transition: max-height .5s ease;
}

.read-more-toggle {
  display: none;
}

.read-more-toggle-label {
  display: inline-block;
  user-select: none;
  cursor: pointer;
  border: none;
  padding: 5px;
  margin: .5em;
  font-size: .8em;
  background: #555;
  color: white;
}

.read-more-toggle-label:after {
  content: "More";
  display: inline-block;
}

.read-more-toggle:checked + .read-more-content {
  display: block;
  /* css animation won't work with "auto"; set to some height larger
	than the content */
  max-height: 1000px;
}

.read-more-toggle:checked + .read-more-content + .read-more-toggle-label:after {
  content: "Less";
}

article {
  border-bottom: 1px solid black;
}

article p {
  margin-bottom: .5em;
}
</style>
<p>fff</p>
  <input id="read-more-toggle-1" class="read-more-toggle" type="checkbox">
 
  <div class="read-more-content">...

 

 

Hostujeme u Českého hostingu       ISSN 1801-1586       ⇡ Nahoru Webtea.cz logo © 20032024 Programujte.com
Zasadilo a pěstuje Webtea.cz, šéfredaktor Lukáš Churý