15/6/13

Tạo Banner quảng cáo trượt dọc 2 bên blog ( phiên bản 3)

Đăng bởi Admin | 15/6/13 | 2 nhận xét

Banner quảng cáo trượt dọc 2 bên trang web là hình thức quảng cáo rất phổ biến hiện nay trên các Forum\Website lớn. Không những giúp tận dụng “đất”, nó còn dễ dàng gây được sự chú ý của người đọc với hiệu ứng trượt theo khi trang được cuộn lên\xuống. Lần trước mình đã giới thiệu cho các bạn

  Hôm nay mình giới thiệu cho các bạn thêm một phiên bản 3, để các bạn có thể lựa chọn theo ý mình muốn

Có gì mới ở phiên bản này:

      + Banner ban đầu sát với lề trên của trình duyệt.

      + Tốc độ trượt mượt hơn.
    + Khi kích thước trình duyệt có chiều ngang nhỏ hơn 1024px, banner tự động biến mất để tránh che khuất các thành phần khác của giao diện.
     + Khi kích thước trình duyệt có chiều ngang lớn hơn 1024px, banner sẽ tự động canh lề & giữ khoảng cách với mép 2 bên trình duyệt để tránh gây ra khoảng trống vô nghĩa.

☼ Cách tiến hành:

   1- Đăng nhập vào Blog
   2- Vào thiết kế
   3- Chọn Phần tử trang
   4- Tạo một widget HTML\JavaScript và chèn vào đoạn code bên dưới :

    <Script type="text/javascript">
    /* design by namkna: http://namkna.blogspot.com/2012/01/tao-banner-quang-cao-voi-hieu-ung-truot.html */
    function ShowRightAdDiv(){
    if (document.body.clientWidth > 900){
    document.write("<table width='110' border=0 cellspacing=0 cellpadding=0><tr><td><a href='http://thuthuatvitinhaz.blogspot.com/' target='_blank' title=''><img border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgbgBb2237zAkjMOQtH_XN1aEDqcbolr0ZNenA6DfNq6YDzckOD6HuN5bHQNUPMugIDpn03P9YNj_hhKQpiYPyn-OtiULXgy-EH0x1TK6pMypdsqxuQWcxlXbwwflchyNjDeDk7mYEjT-54/s1600/banner-quang-cao-dep-nhat-truot-doc-2-ben-namkna-blogspot.png' width='110' style='margin-bottom:4px'></a></td></tr></table>");
    }
    }
    function ShowLeftAdDiv(){
    if (document.body.clientWidth > 900){
    document.write("<table width='110' border=0 cellspacing=0 cellpadding=0><tr><td><a href='http://thuthuatvitinhaz.blogspot.com/' target='_blank' title=''><img border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgbgBb2237zAkjMOQtH_XN1aEDqcbolr0ZNenA6DfNq6YDzckOD6HuN5bHQNUPMugIDpn03P9YNj_hhKQpiYPyn-OtiULXgy-EH0x1TK6pMypdsqxuQWcxlXbwwflchyNjDeDk7mYEjT-54/s1600/banner-quang-cao-dep-nhat-truot-doc-2-ben-namkna-blogspot.png' width='110' style='margin-bottom:4px'></a></td></tr></table>");
    }
    }
    </Script>
    <DIV id="divAdLeft" style="DISPLAY: none; POSITION: absolute; TOP: 10px"><script language="JavaScript">ShowRightAdDiv();</script></DIV>
    <DIV id="divAdRight" style="DISPLAY: none; POSITION: absolute; TOP: 10px"><script language="JavaScript">ShowLeftAdDiv();</script></DIV>
    <SCRIPT language=JavaScript>
    window.onresize=ShowAdDiv;
    function FloatTopDiv()
    {
    
    var ns = (navigator.appName.indexOf("Netscape") != -1);
    
    if(!ns)
    {
    startLX = ((document.body.clientWidth -1215)/2) + 105 , startLY = 0;
    
    startRX = ((document.body.clientWidth)/2) + 391 , startRY = 0;
    }
    else
    {
    startLX = ((document.body.clientWidth -1215)/2) + 105 , startLY = 0;
    startRX = ((document.body.clientWidth -775)/2) + 778 , startRY = 0;
    }
    var d = document;
    
    function ml(id)
    {
    var el=d.getElementById?d.getElementById(id):d.all?d.all[id]:d.layers[id];
    el.sP=function(x,y){this.style.left=x;this.style.top=y;};
    el.x = startRX;
    el.y = startRY;
    return el;
    }
    function m2(id)
    {
    var e2=d.getElementById?d.getElementById(id):d.all?d.all[id]:d.layers[id];
    e2.sP=function(x,y){this.style.left=x;this.style.top=y;};
    e2.x = startLX;
    e2.y = startLY;
    return e2;
    }
    window.stayTopLeft=function()
    {
    if (document.documentElement && document.documentElement.scrollTop)
    var pY = document.documentElement.scrollTop;
    else if (document.body)
    var pY = document.body.scrollTop;
    if (document.body.scrollTop > 10){startLY = 10;startRY = 10;} else {startLY = 10;startRY = 10;};
    ftlObj.y += (pY+startRY-ftlObj.y)/16;
    ftlObj.sP(ftlObj.x, ftlObj.y);
    ftlObj2.y += (pY+startLY-ftlObj2.y)/16;
    ftlObj2.sP(ftlObj2.x, ftlObj2.y);
    setTimeout("stayTopLeft()", 1);
    }
    ftlObj = ml("divAdRight");
    ftlObj2 = m2("divAdLeft");
    stayTopLeft();
    }
    
    function ShowAdDiv()
    {
    var objAdDivRight = document.getElementById("divAdRight");
    var objAdDivLeft = document.getElementById("divAdLeft");
    
    
    if (document.body.clientWidth < 980)
    {
    objAdDivRight.style.display = "none";
    objAdDivLeft.style.display = "none";
    }
    else
    {
    
    objAdDivRight.style.display = "block";
    objAdDivLeft.style.display = "block";
    FloatTopDiv();
    }
    
    }
    ShowAdDiv();
    </SCRIPT>
    Trong đó: 
    • Màu xanh: là linh ảnh hiện thị
    • Màu đỏ: là lien kết tới trang quảng cáo
    Chúc thành công!

                                                                                                      Theo : Namkna
                                                                                                       Thu thuat vi tinh

    2 nhận xét:

    1. Mình làm ko có được lỗi bạn ah`
      http://www.girlxinh10x.blogspot.com

      Trả lờiXóa
      Trả lời
      1. Cái này hay đấy. Bạn làm lại thử xem sao, hoặc tham khảo BÀI NÀY nhé

        Xóa

    Cảm ơn bạn đã nhận xét !
    - Bạn có thể chèn link vào nhận xét bằng thẻ: <a href="Link" rel="nofollow">Tên link</a>
    - Tạo <b>Chữ đậm</b> và <i>Chữ ngiêng</i> cho nhận xét
    - Hãy Chuyển đổi mã code trước khi chèn vào nhận xét
    - Hãy bấm Theo dõi dưới chân trang để nhanh chóng nhận được phản hồi từ Thủ thuật vi tính
    - Những nhận xét nào không lành mạnh hoặc chèn link spam sẽ bị xóa khỏi blog.

    Mã hóa Code

    Support : Trick Blogspot | Ghost win | Website Design | Seo Trick | Ghost win | Software Free | Site Map | Back Link | Contact Advertising | ↑ back to top
    Ghi rõ nguồn thuthuatvitinhaz.blogspot.com dưới dạng liên kết khi phát hành lại thông tin từ trang này
    Copyright © 2013. Thủ thuật Số - All Rights Reserved
    Design by Ngân Giang
    Xem tốt nhất ở độ phân giải 1024 x 768 pixel
    Template by Dameva