3 thg 9, 2007

Random Banner

DangLVH
Dạo một vòng các blog, để ý các banner của một số blog. Mõi lần truy cập vào thì cái banner được thay đổi bằng một banner mới. Nếu bạn chưa thấy thì có thể ghé qua blog của YHT

Rất đơn giản, bạn chỉ cần copy đoạn code javascript sau đây:
<!-- wrote by Danglvh -->
<a expr:href='data:blog.homepageUrl' style='display: block'>
<script type='text/javascript'>
var banner= new Array()
banner[0]=&quot;http://yourURL_banner1.jpg&quot;
banner[1]="http://yourURL_banner2.jpg&quot;
banner[2]="http://yourURL_banner3.jpg&quot;
banner[3]="http://yourURL_banner4.jpg&quot;
banner[4]="http://yourURL_banner5.jpg&quot;
banner[5]="http://yourURL_banner6.jpg&quot;
banner[6]="http://yourURL_banner7.jpg&quot;
banner[7]="http://yourURL_banner8.jpg&quot;
banner[8]="http://yourURL_banner9.jpg&quot;
banner[9]="http://yourURL_banner10.jpg&quot;
var random=Math.floor(10*Math.random());
document.write(&quot;<img src='"+banner[random]+"' width='955'/>&quot;);
</script>
</a>
<!-- wrote by Danglvh-->


Vào Template/Edit HTML, tick chọn vào ô Expandable Widget. Tìm đoạn code sau:

<b:section class='header' id='header' maxwidgets='1' showaddelement='no'>
<b:widget id='Header1' locked='false' title='your title (Header)' type='Header'>
<b:includable id='main'>
<div id='header-inner'>


....paste code javascript here.....

</div>
</b:includable>
</b:widget>
</b:section>

Sau khi tìm được đoạn code như trên bạn nhớ sửa giá trị maxwidgets lớn hơn giá trị hiện thời là 1 giá trị. Và showaddelement sửa lại là Yes. Vd đối với dòng code trên thì ta phải sửa lại là:

<b:section class='header' id='header' maxwidgets='2' showaddelement='yes'>

Sau đó bạn copy đoạn code javascript ở trên và paste vào chổ đoạn ...code javascript here....

Vd: Sau khi copy sẽ ra như thế này.

<b:section class='header' id='header' maxwidgets='2' showaddelement='yes'>
<b:widget id='Header1' locked='false' title='your title (Header)' type='Header'>
<b:includable id='main'>
<div id='header-inner'>

<!-- wrote by Danglvh -->
<a expr:href='data:blog.homepageUrl' style='display: block'>
<script type='text/javascript'>
var banner= new Array()
banner[0]=&quot;http://yourURL_banner1.jpg&quot;
banner[1]=&quot;http://yourURL_banner2.jpg&quot;
banner[2]=&quot;http://yourURL_banner3.jpg&quot;
banner[3]=&quot;http://yourURL_banner4.jpg&quot;
banner[4]=&quot;http://yourURL_banner5.jpg&quot;
banner[5]=&quot;http://yourURL_banner6.jpg&quot;
banner[6]=&quot;http://yourURL_banner7.jpg&quot;
banner[7]=&quot;http://yourURL_banner8.jpg&quot;
banner[8]=&quot;http://yourURL_banner9.jpg&quot;
banner[9]=&quot;http://yourURL_banner10.jpg&quot;
var random=Math.floor(10*Math.random());
document.write(&quot;<img src='"+banner[random]+"' width='955'/>&quot;);
</script>
</a>
<!-- wrote by Danglvh-->
</div>
</b:includable>
</b:widget>
</b:section>

Chú ý:
yourURL_banner1.jpg là url(link) đến banner của bạn.
Đoạn code ở trên sử dụng cho 10 banner, nên Math.floor(10*Math.random()); giá trị ở đây sẽ là 10. Nếu bạn chỉ sử dụng 5 banner thì giá trị ở đây phải là 5.
width='955' đây là chiều rộng của banner

Sau khi đã tinh chỉnh và sửa xong mọi thứ, bạn nhấn nút lưu và quay lại blog để kiểm tra.
Chúc bạn thành công! Có gì thì comment nhé!

About the Author

DangLVH / Author & Editor

Has laoreet percipitur ad. Vide interesset in mei, no his legimus verterem. Et nostrum imperdiet appellantur usu, mnesarchum referrentur id vim.

6 comments:

  1. Thêm 1 lưu ý nữa... Do bắt đầu từ banner[0] nên tới banner[9] là đủ 10 cái.

    Tui thấy cái này nhiều người hay bị nhầm lắm (có tui trong đó >,<)!

    Trả lờiXóa
  2. bài của YHT nè
    Ban đầu viết dài thế nên để luôn,không thèm sửa lại.Cách của Đăng ngắn hơn.

    Trả lờiXóa
  3. hồi trưa có một bạn, bạn đó tên Đức. Bạn đó dùng cách của thầy để làm Random Banner nhưng ko hiểu sao ko dc, em vô test cả buổi không thấy sai chổ nào mà ko chạy dc. Chắc là bị một lỗi ngớ ngẩn nào đó nên ko chạy dc, rùi mài mò mãi mới ra dc đoạn code này, nó chạy dc nên share cho bà con lun.

    Trả lờiXóa
  4. Camiseta Personalizada21:22 4 tháng 9, 2007

    Oi, achei teu blog pelo google tá bem interessante gostei desse post. Quando der dá uma passada pelo meu blog, é sobre camisetas personalizadas, mostra passo a passo como criar uma camiseta personalizada bem maneira. Se você quiser linkar meu blog no seu eu ficaria agradecido, até mais e sucesso.(If you speak English can see the version in English of the Camiseta Personalizada.If he will be possible add my blog in your blogroll I thankful, bye friend).

    Trả lờiXóa
  5. có thể bỏ luôn cái maxwidgets attibute đi. Khi đó, ko còn giới hạn max widgets nữa

    Trả lờiXóa
  6. hoặc có thể làm theo đoạn code dưới đây:
    <html>
    <head>
    <script language="JavaScript">
    // slideshow image counter
    var i = 0;
    function slideShow()
    {
    // set up list of images
    slidesArray = new Array()

    slidesArray[0]="image1.jpg"
    slidesArray[1]="image2.jpg"
    slidesArray[2]="image3.jpg"
    slidesArray[3]="image4.jpg"
    slidesArray[4]="image5.jpg"

    // load image
    document.images[0].src=slidesArray[i]

    // increment counter
    i=i+1;

    // when at the end, start again
    if(i==5) { i=0; }
    }
    </script>
    </head>
    <body onLoad="javascript:setInterval('slideShow()',5000);">
    <img src="image1.jpg" name="image">
    </body>
    </html>

    Trả lờiXóa

Recent Posts

Posts

Popular Posts