EDIT: I just tried this in internet explorer, opera and firefox and it works (I'm using chrome). How can I make it work better in chrome? (I've cleared my cache etc...)
Ok this is doing my nut in! Any help would be appreciated!
This is my site:
www.stuartcuss.co.uk
I'd like the vertical banner on the right to cycle through a bunch of images when you hit refresh. Currently it's not working, it's just sticking on one image.
I have a folder with the images in and this php file. Apparently I just need to put the php file in the same folder as the images and change some stuff, then link to it with an img src script.
PHP File:
The site uses a CMS called indexhibit, there is a box which I can change which displays the banner. This is how I've linked to the php file:
Finally, the css for the site is here if that helps!
What do I do?! Help!
Ok this is doing my nut in! Any help would be appreciated!
This is my site:
www.stuartcuss.co.uk
I'd like the vertical banner on the right to cycle through a bunch of images when you hit refresh. Currently it's not working, it's just sticking on one image.
I have a folder with the images in and this php file. Apparently I just need to put the php file in the same folder as the images and change some stuff, then link to it with an img src script.

PHP File:
PHP:
<?
/*/////////////////////////////////////////////////////////////////////////////////////////
Created by: Mr_density
Description:
A simple random image generator.
I wrote this script because i had some trouble with other similar scripts that didn't work
as well as this one.
Instructions:
1. Just put this script in the directory containing your images and connect via a
browser to this script. The script wil only show images (jpg, gif, png) not other
file formats.
2. Via an html image tag your can call the script on your site.
syntax: <img src="randompic.php"> or <img src="randompic.php?tnsize=XXX"> (to resize).
Change $config["systempath"] to the path where the images are stored (not the URL and no slash on the end).
Change $config["webpath"] to the path where the images can be found through a webbrowser (include a ending slash).
The options for $config["type"] are "redirect" and "readfile". Redirect will use a "location" header wich will display the image (kind of redirect so). Readfile will read the file from the local hardrive and directly displayed (actually I can not recommend that).
////////////////////////////////////////////////////////////////////////////////////////*/
$config["images/randomheader"] = "";
$config["http://www.stuartcuss.co.uk/images/"] = "";
$config["redirect"] = "redirect";
if($config["images/randomheader"] != "")
{
$dircheck = $config["images/randomheader"];
if (is_dir($dircheck)) //check if it is a valid systempath
{
$pathtoread = $config["images/randomheader"];
}
else
{
// If not, it creates an error image and displays it
$img = imagecreate(150, 150);
$red = imagecolorallocate($img, 255, 0, 0);
$yellow = imagecolorallocate($img, 255,255, 0);
imagestring($img, 4, 20, 20, "System", $yellow);
imagestring($img, 4, 20, 40, "path", $yellow);
imagestring($img, 4, 20, 60, "error!", $yellow);
imagepng($img);
imagedestroy($img);
exit();
}
}
else
{
$pathtoread = "."; //Dir where this file is stored
}
if($config["http://www.stuartcuss.co.uk/images/"] != "")
{
$url = $config["http://www.stuartcuss.co.uk/images/"];
}
else
{
$explode = explode("/",$_SERVER["REQUEST_URI"]);
$url = "http://".$_SERVER["SERVER_NAME"]."/";
for($i=0;$i<(count($explode)-1);$i++)
{
$url.=$explode[$i]."/";
}
}
$imgdir = opendir($pathtoread);
while($file = readdir($imgdir))
{
$images[count($images)] = $file; //search all files
}
closedir ($imgdir);
// Removes all non-image files
$tempvar = 0;
for ($i = 0; $images[$i]; $i++)
{
$ext = strtolower(substr($images[$i],-4));
if ($ext == ".jpg" || $ext == ".gif" || $ext == "jpeg" || $ext== ".png" )
{
$images1[$tempvar] = $images[$i];
$tempvar++;
}
}
//Get a random image
$randomnr = rand(0, count($images1)-1);
$img = $images1[$randomnr];
//To resize a image
if(isset($tnsize))
{
$tnsize = (integer) $tnsize;
if (($tnsize < 20) || ($tnsize > 300))
{
// If not, it creates an error image and displays it
$img = imagecreate(150, 150);
$red = imagecolorallocate($img, 255, 0, 0);
$yellow = imagecolorallocate($img, 255,255, 0);
imagestring($img, 4, 20, 20, "Afmetingen", $yellow);
imagestring($img, 4, 20, 40, "kloppen", $yellow);
imagestring($img, 4, 20, 60, "niet!", $yellow);
imagepng($img);
imagedestroy($img);
exit();
}
if ($ext == ".jpg" || $ext == "jpeg")
{
$bigimage = @imagecreatefromjpeg($img);
}
if ($ext == ".gif")
{
$bigimage = @imagecreatefromgif($img);
}
if ($ext == ".png" || $ext == "jpeg")
{
$bigimage = @imagecreatefrompng($img);
}
//Create an empty image of the given size
$tnimage = imagecreate($tnsize, $tnsize);
$darkblue = imagecolorallocate($tnimage, 0,0, 127);
imagecolortransparent($tnimage,$darkblue);
//Calculate the resizing image factor
$sz = getimagesize($img);
$x = $sz[0];
$y = $sz[1];
if ($x > $y)
{
$dx = 0;
$w = $tnsize;
$h = ($y / $x) * $tnsize;
$dy = ($tnsize - $h) / 2;
}
else
{
$dy = 0;
$h = $tnsize;
$w = ($x / $y) * $tnsize;
$dx = ($tnsize - $w) / 2;
}
// Resizes the image
imagecopyresized($tnimage, $bigimage, $dx, $dy, 0, 0, $w, $h,$x, $y);
// Displays the image
imagepng($tnimage);
// Clears the variables
imagedestroy($tnimage);
imagedestroy($bigimage);
}
else
{
if($config["redirect"]=="redirect"){
header("Location: ".$url.$img);
}
else if($config["redirect"]=="readfile"){
readfile($pathtoread."/".$img);
}
else
{
echo "Error: unknown displaytype";
}
}
?>
The site uses a CMS called indexhibit, there is a box which I can change which displays the banner. This is how I've linked to the php file:

Finally, the css for the site is here if that helps!
Code:
/**
* CSS
*
* @version 1.0
* @author Vaska
* @author Gregory Cadar
* @author Columner Theme by Mathieu Hardiviller (www.hmplus.net)
*/
* {
margin : 0;
padding : 0;
}
body {
font-size: 8pt;
font-family: Arial, Helvetica, sans-serif;/* font of all the text in your website except for sections overwritten.
Go to www.typetester.org to test sizes and see the list of safe fonts - If the user doesnt have the first one, it try the second, and goes along the list until it finds a font that the computer has installed */
color: black; /* color of all the text in your website except for links and other sections overwritten */
text-align: left;
background-color: white; /* sets the background color */
line-height : 120%;
}
body.section-1 { }
body.section-2 { }
body.section-3 { }
/* LINKS */
/* colors for all links */
a:link {
text-decoration: none;
background-color: #FFFFFF;
color: black;
}
a:active {
text-decoration: none;
background-color: #FFFFFF;
color: black;
}
a:visited {
text-decoration: none;
background-color: #FFFFFF;
color: black; }
a:hover {
text-decoration: none;
background-color: #FF0000;
color:white; }
a img { border: none; }
/* PRE NAV TEXT - Can be accessed in the Exhibit Settings */
#top-section {
position: fixed;
z-index : 900;
right : 0;
width: auto;
margin: 40px 120px 0px 0px;
font-size: 8px;
font-weight: bold;
line-height : 170%;
color: #1a1a1a;
font-family: Arial, Helvetica, sans-serif;
}
#top-section a { /* this is the link property inside the Top-Section */
text-decoration: none;
color: black;
font-weight: 100;
}
#top-section a:hover { /* link property inside the Top-Section when the cursor is over */
color: black;
}
#top-section p {
text-align: right;
}
/* MENU */
#menu {
position: fixed;
width : 100%;
background-color: none;
padding-bottom:10px;
border-bottom: none;
}
#menu .container { padding: 40px 0px 0px 100px; }
#menu ul {
float: left;
width: 150px; /* the width of each column in the menu */
list-style-type: none;
overflow: auto;
margin: 10px 0px 0px 40px;
padding: 0px 0px 0px 0px;
}
#menu ul li.section-title { /* property of the section titles */
color: black;
font-family: Arial, Helvetica, sans-serif;
text-align: left;
width: auto;
font-size: 8pt;
font-weight: bold;
padding: 0px 0px 0px 0px;
margin: 0px 0px 2px 0px;
}
#menu ul li { /* property of the projects/exhibitions titles */
font-family: Arial, Helvetica, sans-serif;
text-align: left;
font-size: 8pt;
width: auto;
margin: 0px 0px 2px 0px;
}
#menu ul li.active {
text-decoration: none;
}
#menu p {
color: black;
width: auto;
font-family: Arial, Helvetica, sans-serif;
text-align: left;
padding: 0px 0px 0px 0px;
margin: 0px 0px 0px 0px;
}
#menu ul a:link {
text-decoration: none;
color: black;
}
#menu ul a:active {
text-decoration: none;
color: black;
}
#menu ul a:visited {
text-decoration: none;
color: black;
}
#menu ul a:hover {
color: white;
}
/* POST NAV AREA : This sets the style for Post-Nav Text which can be accessed in the Exhibit Settings */
#copy {
z-index : 80;
left : 0;
bottom : 0;
margin : 0 0 0 0;
padding : 0px 0px 10px 10px;
background-color: white;
font-size: 8px;
font-family: Arial, Helvetica, sans-serif;
}
/* INDEXHIBIT CREDIT : Always good to credit the CMS that gives you these possibilities */
#indexhibit { /* sets the properties for the "Built with" part */
z-index : 100;
right : 0;
bottom : 0;
margin : 0 0 0 0;
padding : 0px 40px 14px 0px;
font-size: 10px;
font-family: Arial, Helvetica, sans-serif;
text-align : right;
}
#copy {
/* Netscape 4, IE 4.x-5.0/Win and other lesser browsers will use this */
position: absolute;
}
body > #copy {
/* used by Opera 5+, Netscape6+/Mozilla, Konqueror, Safari, OmniWeb 4.5+, iCab, ICEbrowser */
position: fixed;
}
#indexhibit {
/* Netscape 4, IE 4.x-5.0/Win and other lesser browsers will use this */
position: absolute;
}
body > #indexhibit {
/* used by Opera 5+, Netscape6+/Mozilla, Konqueror, Safari, OmniWeb 4.5+, iCab, ICEbrowser */
position: fixed;
}
/* MAIN CONTENT */
#content {
float: left;
height: 400px;
display: inline;
margin: 8px 0px 0px 140px;
padding: 200px 0px 0px 0px; /* the first number sets the height start of the exhibitions zone / under your menu */
z-index: -10;
}
.container {
padding: 0px 0px 0px 0px;
}
/* End Main Content */
/* Fonts / Typefaces */
#content p {
width: 100%;
margin: 0px 0px 5px 0px;
position: static;
}
p {
font-size: 8pt;
line-height: 150%;
font-family: Arial, Helvetica, sans-serif;
text-align: left;
padding: 0px 0px 0px 0px;
margin: 0px 0px 10px 12px;
}
#content a:link {
font-family: Arial, Helvetica, sans-serif;
text-align: left;
padding: 0px 0px 0px 0px;
margin: 0px 0px 0px 0px;
}
h1 {
letter-spacing: -20px;
line-height: 80%;
font-size:1500%;
font-weight: bold;
font-family: Arial, Helvetica, sans-serif;
text-align: left;
padding: 0px 0px 20px 0px;
}
h2 {
font-size:500%;
line-height: 120%;
font-weight: normal;
font-family: Arial, Helvetica, sans-serif;
text-align: left;
padding: 0px 0px 10px 0px;
}
h3 {
font-size: 50px;
line-height: 100%;
letter-spacing: -5px;
font-weight: bold;
font-family: Arial, Helvetica, sans-serif;
text-align: left;
padding: 0px 0px 10px 0px;
}
h4 {
font-size: 12px;
}
#img-container {
margin: 0px 0px 0p 0px;
padding: 0px 0px 0px 0px;
}
#img-container p {
width: auto;
//margin: 0px 0px 0px 0px;
// padding: 0px 0px 0px 0px;
}
/* End Fonts / Typefaces */
#once { clear: left; }
What do I do?! Help!
Last edited: