Hướng dẫn code quảng cáo đứng & trượt dọc 2 bên trang Web

Thứ Ba, 9 tháng 2, 2016

Hướng dẫn code quảng cáo đứng & trượt dọc 2 bên trang Web

Nguyễn Đạt KhánhThứ Ba, tháng 2 09, 2016 Facebook Comment Không có nhận xét nào

Sau khi đọc bài viết Code Popup quảng cáo tổng hợp tại ITViet360 thì nhiều bạn có nhu cầu và hỏi thêm dạng code quảng cáo đứng hoặc trượt dọc 2 bên trang Web. Với code quảng cáo trượt dọc 2 bên Website sẽ gây được sự chú ý lớn.

Ở bài viết này ITViet360 sẽ giới thiệu với bạn 2 loại quảng cáo 2 bên được dùng thông dụng nhất hiện nay. Và cách thêm chúng như thế nào?

Đối với Blogspot

- Bạn chỉ cần dán code vào 1 tiện ích HTML/Javascript/

Đối với Website

- Bạn thêm code vào nằm trong thẻ <body> ... </body> là được

1. Code quản cáo đứng dọc cố định 2 bên trang Website.

Demo tại Blog: Dịch vụ SEO Web hàng đầu

<div id="left_ads_float">






        <a href="http://seophongvu.com" target="_blank"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhsQH86xakOYO-ObLkeYsO-IenEC-FXb0vDfWP6CrhRSiscXsx8Cj7W0yBL7Q-ddAxVkDMEL9_qRTtHFB8zgDD3Bp-9HEEBUz-w1jLMj5CfuAbn0-f6rQHSemZWJ1aN_FnFYHT516uG5Y4r/s1600/banner-doc-web.jpg" width="170" /></a>




    </div>




    <div id="right_ads_float">




       <a href="http://seophongvu.com" target="_blank"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhsQH86xakOYO-ObLkeYsO-IenEC-FXb0vDfWP6CrhRSiscXsx8Cj7W0yBL7Q-ddAxVkDMEL9_qRTtHFB8zgDD3Bp-9HEEBUz-w1jLMj5CfuAbn0-f6rQHSemZWJ1aN_FnFYHT516uG5Y4r/s1600/banner-doc-web.jpg" width="170" /></a>




    </div>




<style>




#left_ads_float




{




    bottom:20px;




    left: 10px;




    position:fixed; }




#right_ads_float




{




    bottom:20px;




    right: 10px;




    position:fixed;




}




</style>




<script>




var vtlai_remove_fads=false;




function vtlai_check_adswidth()




    {




        if(vtlai_remove_fads)




        {




            document.getElementById('left_ads_float').style.display='none';




            document.getElementById('right_ads_float').style.display='none';




            return;




        }else if(document.cookie.indexOf('vtlai_remove_float_ads')!=-1)




        {




            vtlai_remove_fads=true;




            vtlai_check_adswidth();




            return;




        }




        else




        {




            var lwidth=parseInt(document.body.clientWidth);




            if(lwidth<1110)




            {




                document.getElementById('left_ads_float').style.display='none';




                document.getElementById('right_ads_float').style.display='none';




            }




            else




            {




                document.getElementById('left_ads_float').style.display='block';




                document.getElementById('right_ads_float').style.display='block';




            }




            setTimeout('vtlai_check_adswidth()',10);




        }




    }




</script>

2. Code quản cáo trượt dọc khi kéo thanh cuộn lên xuống.

Demo tại Blog: Công ty SEO uy tín

2. Code quản cáo trượt dọc khi kéo thanh cuộn lên xuống. Demo tại Blog: Công ty SEO uy tín

width="170" : chiều rộng của banner. Có 2 giá trị được đánh dấu màu cam MainContentW = 1000 : chiều rộng trang web. Có 2 giá trị được đánh dấu cùng màu tím, LeftAdjust = 5 : khoảng cách từ mép trái trang web đến banner RightAdjust = 5 : khoảng cách từ mép phải trang web đến banner TopAdjust = 10 : khoảng cách từ mép trên trang web đến banner Read more: http://www.itviet360.com/2014/04/code-quang-cao-truot-doc-2-ben-web.html#ixzz3zfdB3cH5; word-wrap: break-word;">

</div>

</div>

function FloatTopDiv()

{

startLX = ((document.body.clientWidth -MainContentW)/2)-LeftBannerW-LeftAdjust , startLY = TopAdjust+80;

startRX = ((document.body.clientWidth -MainContentW)/2)+MainContentW+RightAdjust , startRY = TopAdjust+80;

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 + 'px';this.style.top=y + 'px';};

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 + 'px';this.style.top=y + 'px';};

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 > 30){startLY = 3;startRY = 3;} else {startLY = TopAdjust;startRY = TopAdjust;};

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");

//stayTopLeft();

ftlObj2 = m2("divAdLeft");

stayTopLeft();

}

function ShowAdDiv()

{

var objAdDivRight = document.getElementById("divAdRight");

var objAdDivLeft = document.getElementById("divAdLeft");

if (document.body.clientWidth < 1000)

{

objAdDivRight.style.display = "none";

objAdDivLeft.style.display = "none";

}

else

{

objAdDivRight.style.display = "block";

objAdDivLeft.style.display = "block";

FloatTopDiv();

}

</script>

document.write("<script type='text/javascript' language='javascript'>MainContentW = 1000;LeftBannerW = 125;RightBannerW = 125;LeftAdjust = 5;RightAdjust = 5;TopAdjust = 10;ShowAdDiv();window.onresize=ShowAdDiv;;<\/script>");

</script>

width="170" : chiều rộng của banner. Có 2 giá trị được đánh dấu màu cam

MainContentW = 1000 : chiều rộng trang web. Có 2 giá trị được đánh dấu cùng màu tím,

LeftAdjust = 5 : khoảng cách từ mép trái trang web đến banner

RightAdjust = 5 : khoảng cách từ mép phải trang web đến banner

TopAdjust = 10 : khoảng cách từ mép trên trang web đến banner

Socializer Widget by Nguyen D. Khanh

SOCIALIZE IT →

Các bạn có thể tham khảo thêm nhiều kiến thức từ các bài viết mà mình đã SEO bằng các Từ khóa bên dưới bài đăng nầy để tìm hiểu thêm về các khái niệm và ứng dụng có liên quan nhé..

Share:

LIKE and Share this article: :

Nguyễn Đạt Khánh | Thứ Ba, tháng 2 09, 2016 | Popup | Thủ thuật Blogger

Được viết bởi Khánh Nguyễn

Blog của tôi, Nguyễn Đạt Khánh là tên của tôi :
Nghề nghiệp: IT Computer Networking - Kỹ thuật viên Mạng máy tính Viễn thông
Bạn đang xem Blog của tôi. Đừng quên nhấn Like và Share để ủng hộ. Một điều tốt nhất mà tôi mong đợi, là những dòng Comments thiện chí với nhau. Xin chân thành cảm ơn tất cả các bạn.

Nơi truy cập vào Nick của Tôi trên mạng: