Jak wykonać zwijanie i rozwijanie zawartości w Bootstrap?

Dla specjalistów Webmastering
#1

Cześć Wszystkim!

 

Kuleję w tej kwestii i mam pytanie: w jaki sposób zwijać zawartość w Bootstrap?

Mam namyśli zwijanie zawartości w taki sposób, aby widocznych było kilka elementów, a reszta po kliknięciu rozwiń.

 

Na stronie do projektu jest 50 zdjęć. Chciałbym, aby widocznych było 6, a reszta po rozwinięciu.

Da radę coś takiego zrobić?

 

 

#2

Wrzucasz w php ciastko i wg tego ciastka dodajesz display:none,

albo w js / jquery dajesz również display none.

Obie metody podpinasz pod swoje rozwiń

Najprościej użyć metody show z biblioteki jquery http://api.jquery.com/show/

#3

Nie wiem czy się da, ale będę potrzebował czegoś prostszego w wykonaniu (i ewentualnej modyfikacji) ponieważ to na projekt dla siostry.

Musi mieć stronę dla swojego projektu.

 

Kod treści, którą chcę zawinąć, wygląda następująco:

<section id="Portfolio">
        <div class="container">
            <div class="row">
                <div class="col-lg-12 text-center">
                    <h2>Portfolio</h2>
                    <hr class="star-primary">
                </div>
            </div>
            <div class="row">
                <div class="col-sm-4 portfolio-item">
                    <a href="#portfolioModal1" class="portfolio-link" data-toggle="modal">
                        
                        <img src="img/portfolio/001.png" class="img-responsive" alt="">
                    </a>
                </div>
                <div class="col-sm-4 portfolio-item">
                    <a href="#portfolioModal2" class="portfolio-link" data-toggle="modal">
                        
                        <img src="img/portfolio/002.png" class="img-responsive" alt="">
                    </a>
                </div>
               TUTAJ ZACZĄĆ ZAWIJANIE <div class="col-sm-4 portfolio-item">
                    <a href="#portfolioModal3" class="portfolio-link" data-toggle="modal">
                        
                        <img src="img/portfolio/003.png" class="img-responsive" alt="">
                    </a>
                </div>
				
            </div>
        </div>
    </section>

Od miejsca zaznaczonego chciałbym rozpocząć zawijanie.

Najlepiej byłoby, gdyby dało się coś wstawić (jaką linijkę kodu) do HTML.

Czy jest to możliwe?