Tạo nút ẩn hiện nội dung cho blogspot

Tuy code này trên mạng đã share rất
nhiêu, Hôm nay cdqtkd5a share lại cho các bạn tham khảo. Chỉ với 1 dòng lệnh kết
hợp với các thẻ div là bạn có thể tạo 1 button cho phép ẩn hiện nội dung của bạn
khi click vào nó. Các bạn xem Demo bên dưới bài đăng:

Code 1:

<div>
<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 = 'Ẩn'; } else { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = 'none'; this.innerText = ''; this.value = 'Xem'; }" style="font-size: 10px; margin: 0px; padding: 0px; width: 75px;" type="button" value="Xem" /></div>
<div>
<div style="display: none;">
{Phần nội dung bị ẩn}</div>
</div>
</div>

Nếu như bài đăng quá dài, nếu muốn ẩn ,
thì phải kéo lên trên để thực hiện thao tác nhấn nút Ẩn , gây phiền phức. Để xử
lý tình trạng gây khó khăn cho người đọc, Các bạn có thể dùng code dưới đây.

Code 2:

<div style="margin: 5px 20px 20px;">
<div class="smallfont" style="margin-bottom: 0px;">
Spoiler: <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 = 'Ẩn';  } else {  this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = 'none';  this.innerText = ''; this.value = 'Xem';  }" style="font-size: 10px; margin: 0px; padding: 0px; width: 45px;" type="button" value="Xem" /></div>
<div>
<div style="display: none;">{Phần nội dung bị ẩn}</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 = 'Ẩn';  } else {  this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = 'none';  this.innerText = ''; this.value = 'Xem';  }" style="font-size: 10px; margin: 0px; padding: 0px; width: 45px;" type="button" value="Ẩn" /></div>
</div>

Mời bạn xem thử Code1 dưới đây:

Chào mừng các bạn đến với trang http://cdqtkd5a.blogspot.com/ , trang xem tốt nhất với trình duyệt Google Chrome

Mời bạn xem thử Code 2

Chào mừng các bạn đến với trang http://cdqtkd5a.blogspot.com/ , trang xem tốt nhất với trình duyệt Google Chrome

Chúc bạn thành công

Võ Văn Tùng

Penulis : Unknown ~ Sebuah blog yang menyediakan berbagai macam informasi

Artikel Tạo nút ẩn hiện nội dung cho blogspot ini dipublish oleh Unknown pada hari Friday, January 11, 2013. Semoga artikel ini dapat bermanfaat.Terimakasih atas kunjungan Anda silahkan tinggalkan komentar.sudah ada 0 komentar: di postingan Tạo nút ẩn hiện nội dung cho blogspot