การทำ Collapse โดยใช้ bootstap

ตอบกระทู้


คำถามนี้ เพื่อป้องกันการส่งแบบอัตโนมัติจากสแปมบอท
รูปแสดงอารมณ์
:icon_plusone: :like: :plusone: :gfb: :-D :) :( :-o 8O :? 8) :lol: :x :P :oops: :cry: :evil: :twisted: :roll: :wink: :!: :?: :idea: :arrow: :| :mrgreen: :angry: :baa: :biggrin:
รูปแสดงอารมณ์อื่นๆ

BBCode เปิด
[img] เปิด
[flash] เปิด
[url] เปิด
[Smile icon] เปิด

กระทู้แนะนำ
   

มุมมองที่ขยายได้ กระทู้แนะนำ: การทำ Collapse โดยใช้ bootstap

การทำ Collapse โดยใช้ bootstap

โพสต์ โดย chavikat.p » 04/12/2017 3:43 pm

Collapse คือการซ่อนหรือเปิด กลุ่มข้อมูลหรือ Content ที่มีเนื่อหาจำนวนมาก
ซึ่ง bootstap ก็ได้มีการ จัด ให้เราเรียกใช้ Collapse ได้โดยง่าย


โค้ด: เลือกทั้งหมด

<div class="container">
  <h2>Simple Collapsible</h2>
  <p>Click on the button to toggle between showing and hiding content.</p>
  <button type="button" class="btn btn-primary" data-toggle="collapse" data-target="#demo">Simple collapsible</button>
  <div id="demo" class="collapse">
    Lorem ipsum dolor sit amet, consectetur adipisicing elit,
    sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,
    quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
  </div>
</div>


2017-12-04_15-39-42.png
2017-12-04_15-39-42.png (10.04 KiB) เปิดดู 878 ครั้ง

2017-12-04_15-39-55.png
2017-12-04_15-39-55.png (18 KiB) เปิดดู 878 ครั้ง

ข้างบน