Tạo hộp thoại với nội dung ngẫu nhiên sau mỗi lần load trang

Chức năng:
- Hiển thị được nhiều thông báo.
- Các thông báo sẽ hiển thị random (ngẫu nhiên) sau mỗi lần load trang.
- Có button cho phép đóng phần thông báo lại.
- Để cho chọn vị trí hợp lý, mình khuyên các bạn nên đặt hộp thông báo này ở phần header của blog.
- Sau khi xác định được vị trí đặt hộp thông báo, các bạn tạo 1 widget HTML/Javascript và dán code bên dưới vào:

Code:

<style type="text/css">
#thbao {
padding:6px 0;
border-bottom:1px solid #e6dac3;
}

#thbao-margin {margin: 0 auto;}
.thbao-container {
width:705px;
border: 1px solid #f2b768;
padding: 4px;
font-size:90%;
}
.thbao-header {
background: #ff6734;
color: white;
border:1px solid #ffa789;
padding: 5px 10px;
white-space: nowrap;
}
.thbao-body {
background: #fae9c8;
padding: 5px 10px;
width: 99%;
}
.thbao-close {
float: right;
margin-right: -5px;
}
</style>

<script language="JavaScript">
function hideitem() {
document.getElementById("thbao").style.display="none";
}
//<![CDATA[
thbao = new Array(3);
thbao[0]='{Nội dung đoạn thông báo thứ 1}';
thbao[1]='{Nội dung đoạn thông báo thứ 2}';
thbao[2]='{Nội dung đoạn thông báo thứ 3}';
thbao[3]='{Nội dung đoạn thông báo thứ 4}';

tbindex = Math.floor(Math.random() * thbao.length);
//]]>
</script>

<div id="thbao">
<div id="thbao-margin" class="thbao-container">
<table cellspacing="0" cellpadding="0">
<tbody>
<tr>
<td class="thbao-header"><b>Note</b></td>
<td class="thbao-body">
<a href="#" class="thbao-close" onclick="hideitem()"><img src="http://www.blogger.com/img/close.png" alt="Đóng lại" /></a>
<span class="thbao-text">

<script type="text/javascript">
document.write(thbao[tbindex]);
</script>

</span>
</td>
</tr>
</tbody>
</table>
</div>
</div>

Nếu muốn thêm một hay nhiều thông báo bạn chỉ việc thêm

Code:

thbao[4]='{Nội dung đoạn thông báo thứ 5}';

phía dưới

Code:

thbao[3]='{Nội dung đoạn thông báo thứ 4}';

Để có thể hình dung rõ hơn bạn có thể ra trang index của forum để thấy <:-P

chèn vào thế nào bạn hướng dẫn thêm cho mọi người đi

Bạn vào Thiết kế -> Phần tử trang -> Thêm tiện ích phía trên Bài đăng trên Blog -> Kéo xuống chọn HTML/Javascript -> Chèn code trên vào phần nội dung rồi lưu lại.

Chú ý: Nếu bị vỡ khung thì bạn có thể chỉnh width:705px; ở code thành giá trị phần trăm (100%) hoặc ước tính khoảng cách mà đặt giá trị cho vừa. Have Fun!

Hình như new Array(3); thay số vào mới thêm đc hay sao ấy

Cái lệnh đó không ảnh hưởng gì đến sự xuất hiện cuả thông báo đâu. Không cần thay đổi ở đó nhé.