Hướng dẫn tạo code quảng cáo dạng Image slidebar và float ads - Thcs Nguyễn Tri Phương
Scroll To Top
TRANG CHỦ TRANG CHỦ

TRANG CHỦ » WINDOWS » Thủ thuật máy tính » NukeViet

Hướng dẫn tạo code quảng cáo dạng Image slidebar và float ads

Đăng lúc: Thứ hai - 21/04/2014 21:04 | Người đăng bài viết: admin | Đã xem: 996 | Phản hồi: 0
Hướng dẫn tạo code quảng cáo dạng Image slidebar và float ads

Hướng dẫn tạo code quảng cáo dạng Image slidebar và float ads

Có nhiều bạn hỏi tôi cách để tạo code quảng cáo giống trang WWW.YOURITV.NET - Quà tặng âm nhạc trực tuyến miễn phí. Hôm nay tôi sẽ chia sẻ với các bạn cách thực hiện code này.
Về cơ bản thì nó gồm 2 phần đó là quảng cáo dạng Image slidebar và dạng float ads. Hai phần này đều sử dụng JQuery.
Không cần nói nhiều đến lý do mà các bạn hỏi về script này nữa đúng không, nó khá là hấp dẫn với người xem. Các bạn cứ làm theo là sẽ có ngay những quảng cáo riêng cho mình thôi. Chúng ta cùng bắt đầu nào :
Bước 1 : Nhúng script JQuery mới nhất vào website của bạn (Nếu bạn nào có rồi thì bỏ qua bước này nhé !)

Code:
<script src='https://ajax.googleapis.com/ajax/libs/jquery/2.0.3/jquery.min.js' type='text/javascript'/>
Bước 2 : Thêm đoạn css vào file css của bạn hoặc trong thẻ <style> trên website hay blog của bạn.

Code:
/*Css for Float Ads*/ #floatDivWrapper {font-size:11px} #floatDiv.fixed {position:fixed;top:30px} /*Css for image slidebar*/ .adsslideshow {position:relative; width:160px; height:600px;} .adsslideshow img {position:absolute;left:0; top:0;} .adsslideshow {position:relative; width:160px; height:600px;
.adsslideshow img {position:absolute;left:0; top:0;}
Bước 3 : Copy và paste code dưới đây vào phần bạn muốn hiển thị quảng cáo.

Code:
/*Code for Float Ads*/<script type='text/javascript'>//<=!=[=C=D=A=T=A=[$(document).ready(function(){var documentHeight=$(document).height();if(documentHeight>550){//$("#floatDivWrapper").css('position','fixed');$("#floatDiv").css({'position':'fixed','top':30});var bottomHeight=120;var msie6=$.browser=='msie'&&$.browser.version<7;if(!msie6){var top=$('#floatDiv').offset().top-parseFloat($('#floatDiv').css('margin-top').replace(/auto/,0));$(window).scroll(function(event){var y=$(this).scrollTop();if(y>=top&&y<=(documentHeight-bottomHeight)){$('#floatDiv').addClass('fixed')}else{$('#floatDiv').removeClass('fixed')}})}}});//]=]=></script><script type='text/javascript'>//<=!=[=C=D=A=T=A=[var s=true;function doBlink(){$('.blink').css('display',function(index,val){s=!s;return (s)?'block':'none';})}$(document).ready(function() {setInterval("doBlink()",0)});//]=]=></script><div class='widget HTML' id='floatDiv'>/*Thay nội dung quảng cáo của bạn tại đây*/<a href="#"><img src="http://static.lazada.vn/cms/images%20LAP/20131007_Watches_300x250.jpg" width="285" height="250"/></a></div>/*Code for Float Ads========================================================*/<div class="adsslideshow">/*Thay nội dung quảng cáo của bạn tại đây*/ <a href="#"><img src="http://static.lazada.vn/cms/images%20LAP/2013_08_14_AFF_HAP_160x600.jpg" width="160" height="600" /></a> <a href="#"><img src="http://static.lazada.vn/cms/images%20LAP/2013_08_14_AFF_HnL_160x600.jpg" width="160" height="600"  /></a> <a href="#"><img src="http://static.lazada.vn/cms/images%20LAP/2013_07_18_AFF_ETV_160x600.jpg" width="160" height="600"  /></a> <a href="#"><img src="http://static.lazada.vn/cms/images%20LAP/2013_07_18_AFF_CnL_160x600.jpg" width="160" height="600"  /></a> <a href="#"><img src="http://static.lazada.vn/cms/images%20LAP/2013_07_18_AFF_MnT_160x600.jpg" width="160" height="600"/></a> <a href="#"><img src="http://static.lazada.vn/cms/images%20LAP/2013_08_14_AFF_BOO_160x600.jpg" width="160" height="600"/></a> <a href="h#"><img src="http://static.lazada.vn/cms/images%20LAP/2013_08_14_AFF_Baby_160x600.jpg" width="160" height="600"/></a> <a href="#"><img src="http://static.lazada.vn/cms/images%20LAP/2013_08_14_AFF_FAS_160x600.jpg" width="160" height="600"/></a> <a href="#"><img src="http://static.lazada.vn/cms/images%20LAP/2013_08_14_AFF_GEN_160x600.gif" width="160" height="600"/></a> <a href="#"><img src="http://static.lazada.vn/cms/images%20LAP/2013_08_14_AFF_HnB_120x600.jpg" width="160" height="600"/></a> <a href="#"><img src="http://static.lazada.vn/cms/images%20LAP/2013_08_14_AFF_SPO_160x600.jpg" width="160" height="600"/></a> <a href="#"><img src="http://static.lazada.vn/cms/images%20LAP/20131002_low_budget_shopping_160x600.jpg" width="160" height="600"/></a> <a href="#"><img src="http://static.lazada.vn/cms/images%20LAP/20131004_Iphone_160x600.jpg" width="160" height="600"/></a> <a href="#"><img src="http://static.lazada.vn/cms/images%20LAP/20131007_Watches_120x600.jpg" width="160" height="600"/></a></div><script language="javascript" type="text/javascript">       $(document).ready(function(){           $('.adsslideshow a:gt(0)').hide();   setInterval(function(){    $('.adsslideshow a:first-child').fadeOut()        .next('a').fadeIn()        .end().appendTo('.adsslideshow');},        9000);       });
</script>
 
Kết quả sẽ giống như hình dưới đây :
Code quảng cáo cho website và blog.
Xem demo tại đây.
Các bạn chỉnh thông số cho phù hợp với giao diện website của bạn nhé.
Vậy là xong, quá đơn giản phải không nào các bạn. Chúc các bạn vui vẻ và kiếm được nhiều tiền từ việc đặt quảng cáo.

Về đầu bài viết

Tổng số điểm của bài viết là: 0 trong 0 đánh giá
Click để đánh giá bài viết

Những tin mới hơn

Những tin cũ hơn

 
QUY ĐỊNH THỜI GIAN VÀO LỚP. NĂM HỌC 2015 - 2016
Xem tại đây
Download tại đây
Đừng thấy hoa đẹp mà vội tranh Hoa xinh chưa chắc đã nguyên lành… Hoa xinh, hoa đẹp… nhiều ong bướm! Hoa nhiều ong bướm ắt tàn nhanh!

LỊCH CÔNG TÁCღ

THÀNH VIÊNღ

LỊCHღ


BẢN ĐỒ HÀNH CHÍNHღ

THỐNG KÊ TRUY CẬPღ

Đang truy cậpĐang truy cập : 11


Hôm nayHôm nay : 398

Tháng hiện tạiTháng hiện tại : 34554

Tổng lượt truy cậpTổng lượt truy cập : 3399169

THĂM DÒ Ý KIẾNღ

Bạn biết http://thcsnguyentriphuong-hoavang.edu.vn qua:

Bạn bè, người thân

Công cụ tìm kiếm (Cốc Cốc, google, Bing...)

Quảng cáo (tạp chí, băng đĩa,...)

Lựa chọn khác

MỖI LÚC MỘT NỤ CƯỜIღ




Trang web hiển thị tốt nhất với trình duyệt Coccoc, FirefoxGoogle Chrome và cài Flash Player với độ phân giải 1024x768 pixels trở lên!
Website được thiết kế bởi: Phạm Văn Phương - trường thcs Trần Quang Khải
Hỗ trợ thiết bị di động.   Liên hệ kỹ thuật