i need a script to make the header images change every 10 seconds or so? [closed]
It's difficult to tell what is being asked here. This question is ambiguous, vague, incomplete, overly broad, or rhetorical and cannot be reasonably answered in its current form. For help clarifying this question so that it can be reopened, visit the help center.
Closed 11 years ago.
i know a little php. Can anyone tell me how to write a simple php script so that the image in the header changes ev开发者_如何学运维ery 5 seconds or so. I dont want to place any kind of links on that image just want to change the images . thank you :))
I wouldn't know a huge amount about PHP I'm afraid but here is a good little script I found written in javascript that may help you:
http://www.go4expert.com/forums/showthread.php?t=1012
Hope that helps at all.
<html>
<head>
<title>Image Rotate
</head>
<body>
<img src="" name="Rotating" id="Rotating1" width=100 height=100>
<img src="" name="Rotating" id="Rotating2" width=100 height=100>
<script language="JavaScript">
var ImageArr1 = new Array("Picture(3).jpg","Picture(1).jpg","Picture(2).jpg");
var ImageHolder1 = document.getElementById('Rotating1');
var ImageArr2 = new Array("Picture(5).jpg","Picture(6).jpg","Picture(7).jpg");
var ImageHolder2 = document.getElementById('Rotating2');
function RotateImages(whichHolder,Start)
{
var a = eval("ImageArr"+whichHolder);
var b = eval("ImageHolder"+whichHolder);
if(Start>=a.length)
Start=0;
b.src = a[Start];
window.setTimeout("RotateImages("+whichHolder+","+(Start+1)+")",1500);
}
RotateImages(1,0);
RotateImages(2,0);
</script>
</body>
</html>
PHP can only provide the image, you need a little bit of JavaScript to trigger events fetching the new images.
Here's a way to do it, adapted from http://javascript.internet.com/miscellaneous/random-image-rotator.html:
<HTML>
<HEAD>
<!-- STEP ONE: The core of it: JavaScript... -->
<SCRIPT LANGUAGE="JavaScript">
<!-- Original: Robert Bui (astrogate@hotmail.com) -->
<!-- Web Site: http://astrogate.virtualave.net -->
<!-- Begin
var interval = 2.5; // delay between rotating images (in seconds)
var random_display = 1; // 0 = no, 1 = yes
interval *= 1000;
var image_index = 0;
image_list = new Array();
image_list[image_index++] = new imageItem("http://www.something.com/image01.jpg");
image_list[image_index++] = new imageItem("http://www.something.com/image02.jpg");
image_list[image_index++] = new imageItem("http://www.something.com/image03.jpg");
image_list[image_index++] = new imageItem("http://www.something.com/image04.jpg");
var number_of_image = image_list.length;
function imageItem(image_location) {
this.image_item = new Image();
this.image_item.src = image_location;
}
function get_ImageItemLocation(imageObj) {
return(imageObj.image_item.src)
}
function generate(x, y) {
var range = y - x + 1;
return Math.floor(Math.random() * range) + x;
}
function getNextImage() {
if (random_display) {
image_index = generate(0, number_of_image-1);
} else {
image_index = (image_index+1) % number_of_image;
}
var new_image = get_ImageItemLocation(image_list[image_index]);
return(new_image);
}
function rotateImage(place) {
var new_image = getNextImage();
document[place].src = new_image;
var recur_call = "rotateImage('"+place+"')";
setTimeout(recur_call, interval);
}
// End -->
</script>
</HEAD>
<!-- STEP TWO: Insert the onLoad event handler into your BODY tag -->
<BODY OnLoad="rotateImage('rImage')">
<!-- STEP THREE: Copy this code into the BODY of your HTML document -->
<center>
<img name="rImage" src="http://www.something.com/image01.jpg" width=120 height=90>
</center>
</BODY>
</HTML>
加载中,请稍侯......
精彩评论