เปลี่ยนภาพ Background ด้วย Javascript ง่ายมาก
พอดีได้ทำเว็บแห่งหนึ่ง ก็เลยอยากเอาเทคนิคเล็กๆ น้อยๆ มาเติมสีสันให้แก่เว็บครับ
http://www.thanakitthaisilk.com
ส่วนล่างนี้อยู่ใน Head นะครับ
<style type="text/css">
.main_body {
background-repeat:no-repeat;
background-image:url(ranpic/1.png);
}
</style>
<script type="text/javascript">
function LoadImage(){
var images=new Array();
images[0]=["1.jpg"];
images[1]=["2.jpg"];
images[2]=["3.jpg"];
images[3]=["4.jpg"];
images[4]=["5.jpg"];
images[5]=["6.jpg"];
images[6]=["7.jpg"];
images[7]=["8.jpg"];
images[8]=["9.jpg"];
// Following code generates a random number
var now = new Date();
var ry = now.getSeconds() % images.length;
newImage = images[ry][0];
document.getElementById('main_body').style.backgroundImage = "url(ranpic/" + newImage + ")";
}
</script>
ส่วน body ก็ใส่แบบนี้ครับ นั่นหมายถึงทุกๆ ครั้งที่ คลิ็กพื้นที่เว็บก็ให้มันเปลี่ยนรูปเลยครับ
<body id="main_body" class="main_body" onclick="javascript:LoadImage();">
ความเห็น (0)
ไม่มีความเห็น