Avatar billede artico Novice
20. maj 2016 - 20:13 Der er 1 løsning

Find og luk div

Jeg har flg.

$('.top').on('click', function() {
        $parent_box = $(this).closest('.box');
        $parent_box.siblings().find('.bottom').hide();
        $parent_box.find('.bottom').toggle();
    });

OG.....

<div class="container">
  <div class="row">
    <h2>Responsive Grid</h2>
    <hr>
    <section id="pinBoot">
      <article class="white-panel"><img src="http://i.imgur.com/sDLIAZD.png" alt="">
        <h4><a href="#">Title 1</a></h4>
        <p>Lorem ipsum dolor.</p>

                    <div class="box">
                    <div class="top">
                      <span class="label label-primary">1</span>
                  <span class="label label-primary">2</span>
                  <span class="label label-primary">3</span>
                  <span class="label label-primary">4</span>
                  <span class="label label-primary">5</span>
                  <span class="label label-primary">6</span>
                    </div>
                    <div class="bottom">
                      Bestillingsformen
                    </div>
                  </div>
<p>
  test skriv inden anden box kommer op
</p>
<div class="box">
<div class="top">
  <span class="label label-primary">1</span>
<span class="label label-primary">2</span>
<span class="label label-primary">3</span>
<span class="label label-primary">4</span>
<span class="label label-primary">5</span>
<span class="label label-primary">6</span>
</div>
<div class="bottom">
  Bestillingsformen
</div>
</div>
      </article>

      <article class="white-panel"> <img src="http://i.imgur.com/8lhFhc1.gif" alt="">
        <h4><a href="#">Title 2</a></h4>

          <div class="box">
          <div class="top">
            <span class="label label-primary">1</span>
        <span class="label label-primary">2</span>
        <span class="label label-primary">3</span>
        <span class="label label-primary">4</span>
        <span class="label label-primary">5</span>
        <span class="label label-primary">6</span>
          </div>
          <div class="bottom">
            Tilmeldingsform kommer her....
          </div>
        </div>
        <p>Excepteur sint occaecat.</p>
      </article>
     
      </section>
      </div>
            </div>

Når man klikker på .top så åbner .bottom, og andre .bottom der måtte være åbne lukker, men kun inden for den aktuelle <article> ?

Ideen er at der kun må være en .bottom åben på siden af gangen, men det kan jeg ikke få til at fungere.. :-(

Hvad skal der til ?
Avatar billede artico Novice
21. maj 2016 - 01:33 #1
Fandt selv ud af det.. langt om længe :-)

.box blev fjernet, og JQ:
$('.top').on('click', function() {
        $parent_box = $(this).closest('.white-panel');
        $parent_box.siblings().find('.bottom').hide();
        $parent_box.find('.bottom').toggle();
Avatar billede Ny bruger Nybegynder

Din løsning...

Tilladte BB-code-tags: [b]fed[/b] [i]kursiv[/i] [u]understreget[/u] Web- og emailadresser omdannes automatisk til links. Der sættes "nofollow" på alle links.

Loading billede Opret Preview
Kategori
Vi tilbyder markedets bedste kurser inden for webudvikling

Log ind eller opret profil

Hov!

For at kunne deltage på Computerworld Eksperten skal du være logget ind.

Det er heldigvis nemt at oprette en bruger: Det tager to minutter og du kan vælge at bruge enten e-mail, Facebook eller Google som login.

Du kan også logge ind via nedenstående tjenester