Laman

Thành phần hiển thị popup đóng tự động

0   nhận xét

Một thông báo dạng popup rất cần thiết trong thiết kế web, đặc biệt ứng dụng cho các hình ảnh quảng cáo động. Bạn có thể điều chỉnh khoảng thời gian hiển thị để thành phần popup tự động đóng.

Thông thường để tạo một kiểu quảng cáo dạng popup như vậy, kỹ thuật webdesign phải dùng đến script có dung lượng khá lớn. Tuy nhiên ở đây, tôi sử dụng chức năng đóng thành phần giúp cho script khá gọn nhẹ.

Bạn hãy đặt đoạn code sau đây vào trước thẻ </head>.

<script type='text/javascript'>
function closeelement(){
div = document.getElementById("closeelement");

div.style.display= "none";
}
setTimeout(closeelement, 60000);
</script>

Chú ý trong đoạn code trên, con số 60000 là 60000 mili giây, tức 60 giây, là thời gian hiển thị rồi tự động đóng thành phần.

Trong phần thân trang web, sau thẻ <body>, bạn thiết lập cấu trúc HTML như sau.

<div id='closeelement' style='border: 0 !important; background: transparent; left:15px;bottom:15px;position:fixed;width: 190px;z-index:9999'>
<a href='javascript:closeelement();'>
<img src='http://img405.imageshack.us/img405/1535/closeicon.png' style='float: right;border: 0' title='Đóng'/>
<img src='URL_hình ảnh' style='border: 0'/><br />
Nội dung khác // Nếu bạn chỉ sử dụng hình ảnh thì bỏ phần này
</a>
</div>

Các tham số left, right, top, bottom, z-index dùng để điều chỉnh tọa độ của thành phần hiển thị popup đóng tự động.



Comment của bạn sẽ bị xóa nếu:
- Bạn chèn thẻ liên kết (a tag).
- Nội dung gây khó chịu cho các bạn đọc khác.
- Thắc mắc không liên quan bài viết, hãy post tại Hỏi đáp.
- P/s : Comment chê Admin xấu trai cũng sẽ bị xóa không thương tiếc :D

Comment của bạn sẽ bị xóa nếu:
- Bạn chèn thẻ liên kết (a tag).
- Nội dung gây khó chịu cho các bạn đọc khác.
- Thắc mắc không liên quan bài viết, hãy post tại Hỏi đáp.
- P/s : Comment chê Admin xấu trai cũng sẽ bị xóa không thương tiếc :D