» » tạo button cho phép bạn ẩn/hiện nội dung

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ó. Thủ thuật này mình post theo yêu cầu của bạn mecuoi (mecuoi.com). Thủ thuật này ta thường thấy trong các forum, và bạn mecuoi cũng lấy ý tưởng từ đó.


Demo:
Phần nội dung hiển thị

Code:



Phần nội dung hiển thị
<div>
<div>
<input type="button" value="Xem" style="width:75px;font-size:10px;margin:0px;padding:0px;" 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'; }">
</div>
<div>
<div style="display: none;">
{Phần nội dung bị ẩn}
</div>
</div>
</div>

- Khi các bạn muốn áp dụng cho bài viết của mình thì cứ việc thay thế dòng {phần nội dung bị ẩn} thành nội dung bài viết của bạn là xong.
- Nếu bạn muốn tạo nhiều nút Ẩn/Hiện trong bài viết của mình thì cứ làm tương tự.

About Elizabeth Tong

Hi there! I am Hung Duy and I am a true enthusiast in the areas of SEO and web design. In my personal life I spend time on photography, mountain climbing, snorkeling and dirt bike riding.
«
Next
Newer Post
»
Previous
Older Post

No comments:

Leave a Reply