Hướng Dẫn Tạo Spoiler trong bài đăng

Chào cá bạn !
Hôm nay mình giới thiệu tiếp cùng các bạn thủ thuật rất hay. Đây là code để tạo nút Xem-Ẩn , các bạn copy, dán vào thẻ Edit HTML của khung
soạn thảo. Dùng để chứa các nội dung mà các bạn muốn .





Nội dung cần ẩn hiện ở đây










Đây là code

<center><div> <input onclick="if (this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display != '')  {  this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = ''; this.innerText = ''; this.value = 'Đóng lại';  } else {  this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = 'none';  this.innerText = ''; this.value = 'Mở';  }" style="font-size:16px;background:#23AD1F;color:white; padding: 5px; border-radius:7px;" type="button" value="Mở" /></div><div><div style="display: none;border:1px solid black;width:520px;max-height:400px;overflow:auto;background:#E8EAE8;text-align:left;padding:10px;">


Nội Dung Cần Ẩn Hiện Để Ở đây !!!




</div></div></center>

Dưới đây là ý nghĩa một số vị trí để các bạn dễ sửa theo ý thích, mình đánh dấu bằng các màu khác nhau cho dễ tìm:
     Là dòng chữ hiển thị trên nút (mở rộng/thu gọn)
     Là màu của dòng chữ hiển thị trên nút
     Là màu nền của nút
     Là màu nền của phần nội dung 

Các bạn có thể thay bằng các mã màu đơn giản như : black,red,blue,yellow,white,green,lime,gray,purple,pink .... 
















Không có nhận xét nào:

Copyright © 2013 Mr Sum