แสดงป้ายโฆษณา banner แบบสุ่ม random ด้วย ajax อย่างง่าย

05 November 2008 เขียนเมื่อ 16 ปีก่อน โดย Ninenik Narkdee

ajax random banner

คำสั่ง การ กำหนด รูปแบบ ตัวอย่าง เทคนิค ลูกเล่น การประยุกต์ การใช้งาน เกี่ยวกับ ajax random banner

ดูแล้ว 16,500 ครั้ง

คำเตือน! เนื้อหาต่อไปนี้ เป็นเนื้อหาเก่า อาจจะไม่เหมาะสำหรับนำไปใช้งาน หรือไม่สามารถใช้งานได้แล้ว

<script language="javascript" src="ajax.js"></script> 
<script language="javascript">
function doajax(){
    var ajax1=createAjax();  
    ajax1.onreadystatechange=function(){
        if(ajax1.readyState==4 && ajax1.status==200){
            document.getElementById('myplace').innerHTML=ajax1.responseText;
        }else{
            return false;
        }
    }
    ajax1.open("GET","get_banner.php",true);
    ajax1.send(null);
}
window.onload=function(){
    setInterval("doajax()",2000); // กำหนดให้สลับแบนเนอร์ทุกๆ 2 วินาที
}
</script>
<div id="myplace">
<img src="images/mybanner_1.jpg"  />
</div>

โค้ด get_banner.php

<?php
header("Cache-Control: no-store, no-cache, must-revalidate"); 
header("Cache-Control: post-check=0, pre-check=0", false); 
    $banner_img_arr=array(
        "0"=>"images/mybanner_1.jpg", // key 0 เก็บรูป banner ที่ 1
        "1"=>"images/mybanner_2.jpg", // key 1 เก็บรูป banner ที่ 2
        "2"=>"images/mybanner_3.jpg" // สามารถเพิ่มจำนวนได้
    );
    $banner_link_arr=array(
        "0"=>"http://www.google.com", // เก็บค่า link เรียงลำดับให้ตรงคู่กับรูปภาพ
        "1"=>"http://www.yahoo.com",
        "2"=>"http://www.hotmail.com"    // สามารถเพิ่มจำนวนได้
    );
    $rand_banner=rand(0,2); // ค่า key 0 ถึง 2
    $banner_img=$banner_img_arr[$rand_banner];
    $banner_link=$banner_link_arr[$rand_banner];
    $html_banner="<a href='".$banner_link."' target='_blank'>";
    $html_banner.="<img src='".$banner_img."' border='0'></a>";
    echo $html_banner; // แสดง แบนเนอร์
?>

ดาวน์โหลด ajax.js คลิกดาวน์โหลด

ดูตัวอย่าง คลิกดูตัวอย่าง

กด Like หรือ Share เป็นกำลังใจ ให้มีบทความใหม่ๆ เรื่อยๆ น่ะครับ