Tabccordion

ACCORDION (Mobil) <-> TABS (Desktop)

Test

1. Lorem ipsum dolor sit amet, consectetur adipisicing elit. Nesciunt similique consectetur qui iste fugit modi ipsum quis quaerat adipisci, illum, nostrum iusto aliquam repellendus, minus eaque dolor dignissimos eligendi nulla.

Test ipsum

2. Lorem ipsum dolor sit amet, consectetur adipisicing elit. Nesciunt similique consectetur qui iste fugit modi ipsum quis quaerat adipisci, illum, nostrum iusto aliquam repellendus, minus eaque dolor dignissimos eligendi nulla.

Test

3. Lorem ipsum dolor sit amet, consectetur adipisicing elit. Nesciunt similique consectetur qui iste fugit modi ipsum quis quaerat adipisci, illum, nostrum iusto aliquam repellendus, minus eaque dolor dignissimos eligendi nulla.

Test ipsum

4. Lorem ipsum dolor sit amet, consectetur adipisicing elit. Nesciunt similique consectetur qui iste fugit modi ipsum quis quaerat adipisci, illum, nostrum iusto aliquam repellendus, minus eaque dolor dignissimos eligendi nulla.

Test

5. Lorem ipsum dolor sit amet, consectetur adipisicing elit. Nesciunt similique consectetur qui iste fugit modi ipsum quis quaerat adipisci, illum, nostrum iusto aliquam repellendus, minus eaque dolor dignissimos eligendi nulla.

Code:

<div class="acc-tabs">
Any Selector: h1,h2,h3,h4,h5,h6,div
Content: p,div
Same Selector from above
Content: p,div
</div>

TABS (Mobil) <-> ACCORDION (Desktop)

Test

1. Lorem ipsum dolor sit amet, consectetur adipisicing elit. Nesciunt similique consectetur qui iste fugit modi ipsum quis quaerat adipisci, illum, nostrum iusto aliquam repellendus, minus eaque dolor dignissimos eligendi nulla.

Test ipsum

2. Lorem ipsum dolor sit amet, consectetur adipisicing elit. Nesciunt similique consectetur qui iste fugit modi ipsum quis quaerat adipisci, illum, nostrum iusto aliquam repellendus, minus eaque dolor dignissimos eligendi nulla.

Test

3. Lorem ipsum dolor sit amet, consectetur adipisicing elit. Nesciunt similique consectetur qui iste fugit modi ipsum quis quaerat adipisci, illum, nostrum iusto aliquam repellendus, minus eaque dolor dignissimos eligendi nulla.

Code:

<div class="tabs-acc">
Any Selector: h1,h2,h3,h4,h5,h6,div
Content: p,div
Same Selector from above
Content: p,div
</div>

TABS IN ACCORDION

Test

1. Lorem ipsum dolor sit amet, consectetur adipisicing elit. Nesciunt similique consectetur qui iste fugit modi ipsum quis quaerat adipisci, illum, nostrum iusto aliquam repellendus, minus eaque dolor dignissimos eligendi nulla.

Lorem Test

1. Lorem ipsum dolor sit amet, consectetur adipisicing elit. Nesciunt similique consectetur qui iste fugit modi ipsum quis quaerat adipisci, illum, nostrum iusto aliquam repellendus, minus eaque dolor dignissimos eligendi nulla.

Test Lorem

2. Lorem ipsum dolor sit amet, consectetur adipisicing elit. Nesciunt similique consectetur qui iste fugit modi ipsum quis quaerat adipisci, illum, nostrum iusto aliquam repellendus, minus eaque dolor dignissimos eligendi nulla.

Test ipsum

2. Lorem ipsum dolor sit amet, consectetur adipisicing elit. Nesciunt similique consectetur qui iste fugit modi ipsum quis quaerat adipisci, illum, nostrum iusto aliquam repellendus, minus eaque dolor dignissimos eligendi nulla.

Code:

<div class="acc">
Any Selector: h1,h2,h3,h4,h5,h6,div
Content: p,div

<div class="tabs">
Any Selector: h1,h2,h3,h4,h5,h6,div
Content: p,div
Same Selector from above
Content: p,div
</div>

Same Selector from above
Content: p,div
</div>

ONLY ACCORDION

Test

1. Lorem ipsum dolor sit amet, consectetur adipisicing elit. Nesciunt similique consectetur qui iste fugit modi ipsum quis quaerat adipisci, illum, nostrum iusto aliquam repellendus, minus eaque dolor dignissimos eligendi nulla.

Test ipsum

2. Lorem ipsum dolor sit amet, consectetur adipisicing elit. Nesciunt similique consectetur qui iste fugit modi ipsum quis quaerat adipisci, illum, nostrum iusto aliquam repellendus, minus eaque dolor dignissimos eligendi nulla.

Test

3. Lorem ipsum dolor sit amet, consectetur adipisicing elit. Nesciunt similique consectetur qui iste fugit modi ipsum quis quaerat adipisci, illum, nostrum iusto aliquam repellendus, minus eaque dolor dignissimos eligendi nulla.

Code:

<div class="acc">
Any Selector: h1,h2,h3,h4,h5,h6,div
Content: p,div
Same Selector from above
Content: p,div
</div>

ONLY ACCORDION -> One Open

Test

1. Lorem ipsum dolor sit amet, consectetur adipisicing elit. Nesciunt similique consectetur qui iste fugit modi ipsum quis quaerat adipisci, illum, nostrum iusto aliquam repellendus, minus eaque dolor dignissimos eligendi nulla.

Test ipsum

2. Lorem ipsum dolor sit amet, consectetur adipisicing elit. Nesciunt similique consectetur qui iste fugit modi ipsum quis quaerat adipisci, illum, nostrum iusto aliquam repellendus, minus eaque dolor dignissimos eligendi nulla.

Test

3. Lorem ipsum dolor sit amet, consectetur adipisicing elit. Nesciunt similique consectetur qui iste fugit modi ipsum quis quaerat adipisci, illum, nostrum iusto aliquam repellendus, minus eaque dolor dignissimos eligendi nulla.

Code:

<div class="acc" data-onlyoneopen="yes">
Any Selector: h1,h2,h3,h4,h5,h6,div
Content: p,div
Same Selector from above
Content: p,div
</div>

ONLY TABS

Test

1. Lorem ipsum dolor sit amet, consectetur adipisicing elit. Nesciunt similique consectetur qui iste fugit modi ipsum quis quaerat adipisci, illum, nostrum iusto aliquam repellendus, minus eaque dolor dignissimos eligendi nulla.

Test ipsum

2. Lorem ipsum dolor sit amet, consectetur adipisicing elit. Nesciunt similique consectetur qui iste fugit modi ipsum quis quaerat adipisci, illum, nostrum iusto aliquam repellendus, minus eaque dolor dignissimos eligendi nulla.

Test

3. Lorem ipsum dolor sit amet, consectetur adipisicing elit. Nesciunt similique consectetur qui iste fugit modi ipsum quis quaerat adipisci, illum, nostrum iusto aliquam repellendus, minus eaque dolor dignissimos eligendi nulla.

Code:

<div class="tabs">
Any Selector: h1,h2,h3,h4,h5,h6,div
Content: p,div
Same Selector from above
Content: p,div
</div>