[Code] Khung thông báo ngẫu nhiên đơn giản/đẹp.

  • Kou94
    Demo:

    CSS:
    Code:
     #thbao {
        padding:6px 0;
        border-bottom:1px solid #e6dac3;
        }

        #thbao-margin {margin: 0 auto;}
        .thbao-container {
        width:98%;
        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;
        }


    Script:
    Code:
    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);
        //]]>


    HTML:
    Code:
    <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>

    Hoặc bạn có thể chèn thằng code sau vào nơi muốn hiển thị:
    Code:
    <style type="text/css">
        #thbao {
        padding:6px 0;
        border-bottom:1px solid #e6dac3;
        }

        #thbao-margin {margin: 0 auto;}
        .thbao-container {
        width:98%;
        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>

Thông tin tác giả
avatar
MEM LV3
Bài viết :
114
Points :
169
Like :
9
Punbb
An toàn
Xem lý lịch thành viên
Bài viết liên quan
    Đang tải dữ liệu

Permissions in this forum:
Bạn không có quyền trả lời bài viết