I'm making a prototype for what I need, and images don't appear at all! I composed an HTML page which shows 2 images on page load, and every time you refresh a page, a random image is shown. That works great when you open only the page that ought to show to images, but I need this page to show the images when that page is loaded into an index.php page, too. Which doesn't happen. If you've got the Apache server, you can try it out and you'll see what I mean - it's really easy to set up: just copy these files below to your Apache location and run this files via localhost.
index.php
Number of downloads: 14
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<title>Ajax</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script type="text/javascript">
function Ajax()
{
var
$http,
$self = arguments.callee;
if (window.XMLHttpRequest) {
$http = new XMLHttpRequest();
} else if (window.ActiveXObject) {
try {
$http = new ActiveXObject('Msxml2.XMLHTTP');
} catch(e) {
$http = new ActiveXObject('Microsoft.XMLHTTP');
}
}
if ($http) {
$http.onreadystatechange = function()
{
if (/4|^complete$/.test($http.readyState)) {
document.getElementById('ReloadThis').innerHTML = $http.responseText;
setTimeout(function(){$self();}, 1000);
}
};
$http.open('GET', 'randomImage.html' + '?' + new Date().getTime(), true);
$http.send(null);
}
}
</script>
</head>
<body>
<script type="text/javascript">
setTimeout(function() {Ajax();}, 1000);
</script>
<div id="ReloadThis">Default text</div>
<br>
Other text.
</body>
</html>
randomImage.html
Number of downloads: 14
<html> <head> </head> <body> <script src="refreshDiv.js"></script> <div id="test"> <script src="imageGenerator.js"></script> </div> <p align="center"> <font face="arial" size="-2">This free script provided by</font> <br> <font face="arial, helvetica" size="-2"> <a href="http://javascriptkit.com">Javascript Kit</a> </font> </p> <script src="imageGenerator.js"></script> </body> </html>
imageGenerator.js
/*
Random Image Script- By Javascript Kit (http://www.javascriptkit.com)
Over 400+ free Javascripts here!
Keep this notice intact please
*/
function random_imglink(){
var myimages=new Array()
//specify random images below. You can have as many as you wish
myimages[1]="images/image1.jpg"
myimages[2]="images/image2.gif"
myimages[3]="images/image3.gif"
myimages[4]="images/image4.jpg"
myimages[5]="images/image5.jpg"
myimages[6]="images/image6.jpg"
var ry=Math.floor(Math.random()*myimages.length)
if (ry==0)
ry=1
document.write('<img src="'+myimages[ry]+'" border=0>')
}
random_imglink()
Also, I have the "images" folder with image names (as you can see from the script above) relative to these files.
So, the main problem is that the images are being displayed when you open the page randomImage.html regularly, and are NOT being displayed when randomImage.html is opened through index.html.
The mechanics above should refresh the specified page (inside index.html) every specified time interval.

New Topic/Question
Reply



MultiQuote



|