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:
0 nhận xét