Nếu site bạn rất nhiều bạn bè có tài khoản Google, tại sao không thử chèn thêm một ChatBox để tăng tình năng trò chuyện kết bạn cho Blog. Việc đơn giản phải làm là bạn chỉ cần nhúng một iframe của Google cho sẵn.

Xem DEMO

Các bạn coppy và cài đặt nhé. Và nhớ chỉnh lại CSS. của mình.

<style>
    #chat{position:fixed; top:0px; left:1px;}
    .bt{background:url('http://cdn1.iconfinder.com/data/icons/androiddevicons/dialog.png') no-repeat; width: 48px; height: 48px;}
    #cbody{border-radius: 3px 10px 0px #444;}
</style>
<div id="chat">
<div class="bt" onclick="toggle()" ></div>
<p id="cbody" style="display:none;">
    <iframe height="350" frameborder="0" width="300" src="http://talkgadget.google.com/talkgadget/client?fid=gtalk0&amp;relay=http%3A%2F%2Fwww.google.com%2Fig%2Fifpc_relay"></iframe>
</p>
</div>
<script>
    var $_ = function(x){return document.getElementById(x);}
   
    function toggle(){
    var ck = $_("cbody").style.display;
        if(ck != "none"){
            $_("cbody").style.display = "none";
        }
        if(ck != "block"){
            $_("cbody").style.display = "block";
        }
    }
</script>

Chúc bạn thành công !

Read more…

Hẳn nhiều bạn cần slide này... mình đã phát triển phiên bản thumbail cho site phim. Nhưng gà CSS quá nên đắp chiếu, lấy silder của trang tin tức này cho các bạn dùng.

Nói về jquery thì mình cũng chả rành lắm, đến từ jquery viết còn hay nhầm thì các bạn chắc cũng đoán được. Phần slider rip của gostep.info, các bạn có thể vào đó xem.

Xem DEMO

Mình cũng hơi buồn ngủ, các bạn setup luôn nhé.

CSS (Cái này cũng gà lắm, mọi người tự căn chỉnh nhé !)

<style>
ul#ticker {
    font: "Helvetica,Arial";
    height: 26px;
    overflow: hidden;
    text-align: right;
    color: red;
    font-size: 12px;
    line-height: 28px;
    background: #444;
}
ul#ticker strong,ul#ticker strong a {
    color: green;
    font-size: 10px;
    padding-right: 5px;
    text-transform: uppercase;
}
#ticker a {
    text-decoration: none;
}
ul#ticker a {
    color: white;
    text-decoration: none;
}
ul, li {
    list-style: none outside none;
}
ul#ticker .meta-comments a,.meta-sep,.meta-date{
    color: #777777;
}
</style>

Javascript

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<script src="http://anhnc.googlecode.com/svn/trunk/p/news.js"></script>
<script src="/feeds/posts/default?max-results=12&amp;orderby=published&amp;alt=json-in-script&amp;callback=news"></script>


Phần numberposts (12) có thể unlimit nhé ;))

Chúc các bạn thành công !

Read more…