..Posted by T2KT at 20:51
...4 commnet........
Trong ngôn ngữ của Blog người ta gọi chúng là Banner Rotator Generator. Có 2 loại (1) Thay đổi Banner theo thời gian, (2) Thay đổi banner khi Load (nạp) trang mới.
Bài viết này anh3ngơ giới thiệu với các bạn cả 2 cách trên, để tạo chúng bạn chỉ cần Tạo widget HTML/Javascript rồi copy đoạn mã Script dưới và dán vào đó là xong.
(1) Thay đổi Banner theo thời gian
Với thí dụ dưới, 20 giây thay đổi banner một lần, trong đó banner thay đổi bởi 4 hình ảnh ("Link hình ảnh 1","Link hình ảnh 2","Link hình ảnh 3","Link hình ảnh 4") tương ứng với các link khi clic vào hình ảnh ("Link 1","Link2","Link3","Link4").
Bạn có thể thay đổi thời gian hiển thị bằng cách thay đổi giá trị 20000 (tương đương 20 giây)
<script type="text/javascript">
var imgs1 = new Array("Link hình ảnh 1","Link hình ảnh 2","Link hình ảnh 3","Link hình ảnh 4");
var lnks1 = new Array("Link 1","Link2","Link3","Link4");
var alt1 = new Array("Alt text 1","Alt text 2","Alt text 3","Alt text 4");
var currentAd1 = 0;
var imgCt1 = 4;
function cycle1() {
if (currentAd1 == imgCt1) {
currentAd1 = 0;
}
var banner1 = document.getElementById('adBanner1');
var link1 = document.getElementById('adLink1');
banner1.src=imgs1[currentAd1]
banner1.alt=alt1[currentAd1]
document.getElementById('adLink1').href=lnks1[currentAd1]
currentAd1++;
}
window.setInterval("cycle1()",20000);
</script>
<a href=""Link 1"" id="adLink1 target="_top">
<img src="Link hình ảnh 1" id="adBanner1 border="0" width="125" height="125"></a>
Bạn có thể thêm Banner nhưng nhớ điều chỉnh giá trị var imgCt1 = 4; tương ứng với số banner
Thay đổi chiều rộng và chiều cao width="125" height="125" tương ứng với tiện ích bạn sẽ sử dụng
(2) Thay đổi Banner khi load trang mới
Tương tự ví dụ trên, dưới đây là đoạn code để thay đổi 4 Banner có kích thước 468 x 60 px khi load trang mới.
<script type="text/javascript">
<!-- Begin
rnd.today=new Date();
rnd.seed=rnd.today.getTime();
function rnd() {
rnd.seed = (rnd.seed*9301+49297) % 233280;
return rnd.seed/(233280.0);
};
function rand(number) {
var result = Math.ceil(rnd()*number);
if (!result)result++;
return result
};
var ad_cnt1 = 4;
var ad1 = rand(ad_cnt1);
var link1;
var adBanner1;
var width1
var height1
if (ad1==1) {
link1="Link 1";
adBanner1="Link hình ảnh 1";
width1="468";
height1="60";
alt1="alt text 1";
}
if (ad1==2) {
link1="Link 2";
adBanner1="Link hình ảnh 2";
width1="468";
height1="60";
alt1="alt text 2";
}
if (ad1==3) {
link1="Link 3";
adBanner1="Link hình ảnh 3";
width1="468";
height1="60";
alt1="alt text 3";
}
if (ad1==4) {
link1="Link 4";
adBanner1="Link hình ảnh 4";
width1="468";
height1="60";
alt1="alt text 4";
}
document.write('<center><a href="' + link1 + '" target="_new">');
document.write('<img src="' + adBanner1 + '" width=' + width1 + ' height=' + height1 + ' border=0 alt="' + alt1 + '"></a>');
document.write('</center>');
// End -->
</SCRIPT>
Nếu tăng số lượng banner bạn thêm lần lượt theo thứ tự, ví dụ nếu muốn banner thứ 5 bạn thêm :
}
if (ad1==5) {
link1="Link 5";
adBanner1="Link hình ảnh 5";
width1="468";
height1="60";
alt1="alt text5";
}
Vào dưới code:
}
if (ad1==4) {
link1="Link 4";
adBanner1="Link hình ảnh 4";
width1="468";
height1="60";
alt1="alt text 4";
}
Và thay đổi giá trị var ad_cnt1 = 4; tương ứng với số banner (hình ảnh), trong thí dụ trên nếu thêm banner thứ 5 thì giá trị của nó sẽ là var ad_cnt1 = 4;
Nhớ thay đổi giá trị chiều cao và rộng cho phù hợp.
Trên đây là hướng dẫn thực hiện cách để chạy một tiện ích thay đổi banner trên blog, nếu bạn muốn có tiện ích thay đồi thứ 2 thì cần thay các giá trị thành số tiếp theo (thay các giá trị imgs1, lnks1, currentAd1,... thành số tiếp theo tương ứng với số tiện ích), ví dụ với tiện ích thay đổi banner thứ 2 trên blog thì các giá trị của nó sẽ là (imgs2, lnks2, currentAd2,...)
Chúc các bạn thành công .
....Chia sẽ bài viết qua:
Loading related posts... 
..Bản In
..Quay về
..Đặt làm trang chủ
..Lên đầu
trang
4 nhận xét
:))
;))
;;)
:D
;)
:p
:((
:)
:(
:X
=((
:-o
:-/
:-*
:|
8-}
:)]
~x(
:-t
b-(
:-L
x(
=))
Với lại, cho mình hỏi, khi mình copy Code đó vào Phần "Chỉnh sửa HTML" (Chỉnh sửa mẫu của Trang blogger), sau khi lưu xong, ra xem blog thì phần code cài thêm này nó k hiển thị gì hết, blog vẫn y như cũ.
Có thể giúp mình k???