Javascript hosting not working...

manic111

manic111

manic111

Soldato
Joined
1 Jul 2007
Posts
21,268
Location
Various
I've just attempted to upload my website using 000webhost, and have a small section of the page written in Javascript. For some reason, this refuses to display on any browser. All of the locations of the pictures which it ought to be showing are correct, and it works fine when I view it locally (by opening my html document in a browser). Any ideas?

Here is the page: http://marknichols.net84.net/ (I know that there isn't very much up at the moment!). The picture in the top left (not just black and white) is not written in Javascript on that page, but I would like it to be; I want it to rotate through a selection of different pictures when the page is refreshed.

Here is the Javascript script that works fine locally, but which, for some reason, I can't get working when it's uploaded:

Code: 
<script language="Javascript">
<!--
 var imlocation = "images/";
 var currentdate = 0;
 var image_number = 0;
 function ImageArray (n) {
   this.length = n;
   for (var i =1; i <= n; i++) {
     this[i] = ' '
   }
 }
 image = new ImageArray(6)
 image[0] = 'brightsmall.jpg'
 image[1] = 'colourfulsmall.jpg'
 image[2] = 'focussedsmall.jpg'
 image[3] = 'not black and whitesmall.jpg'
 image[4] = 'yellow mellowsmall.jpg'
 image[5] = 'font.jpg'
 var rand = 60/image.length
 function randomimage() {
 	currentdate = new Date()
 	image_number = currentdate.getSeconds()
 	image_number = Math.floor(image_number/rand)
 	return(image[image_number])
 }
 document.write("<img src='" + imlocation + randomimage()+ "'>");
//-->
</script>

Rather than displaying one of the pictures, it merely displays a small box at the top left of the screen. Thanks in advance for the help :D
 
Last edited:
SimonCHere said:
Code?
Click to expand...

Code: 
<html>
<head>
<title>Mark Nichols -- About Me</title>
<style type="text/css">

body { margin:0; padding:0; background-color:#000000; width:100%; height:100%; 
font size:em; max-height:1200px; max-width:1900px; min-height:480px; min-width:600px }

p,h1,h2,body,a { font-family:"times new roman"; margin: 0; }

a { color:#ffffff; text-weight:bold; }

a:hover { color:#003399; text-decoration:underline; }

p { font-size:1.2em; color: #000000; padding: 15px; text-align: left; }

h1 { font-size:1.9em; color: #000000; text-align: center; padding: 15px; }

h2 { font-size:2.4em; color: #ffffff; padding:0; }

#header { position: relative; float: left; width: 60%; height: 15%; color: #000000; min-width:350px;
 min-height:110px; max-height:200px; margin-top:15px; }

#left { position: relative; float: left; width: 20%; height: 100%; color: #000000; max-height:900px; 
min-width: 20px; }

#right { position: relative; float: right; width: 20%; height: 100%; color: #000000; max-height:900px;
min-width: 20px; }

#main { position: relative; float:left; width: 60%; height: 75%; 
background-color: #ffffff; min-width: 350px; min-height: 450px; max-height: 1200px; max-width: 1900px}

#footer { position: relative; clear:left; width:60%; height:10% color: #000000; min-width:350px; }

.align-right { float:right; margin: 0 0 0 0;}

.header { vertical-align:bottom; margin:0; position:absolute; bottom:0px; float:right; right: 0px; }

.align-left { float:left; margin: 0 0 0 0; position:relative; display:inline; }

.top { vertical-align:top; margin:5px; position:absolute; top:5px; }

</style>
</head>

<body>
<div id="right">
</div>
<div id="left">
</div>

<div id="header">
<script language="Javascript">
<!--
 var imlocation = "images/";
 var currentdate = 0;
 var image_number = 0;
 function ImageArray (n) {
   this.length = n;
   for (var i =1; i <= n; i++) {
     this[i] = ' '
   }
 }
 image = new ImageArray(6)
 image[0] = 'brightsmall.jpg'
 image[1] = 'colourfulsmall.jpg'
 image[2] = 'focussedsmall.jpg'
 image[3] = 'not black and whitesmall.jpg'
 image[4] = 'yellow mellowsmall.jpg'
 image[5] = 'font.jpg'
 var rand = 60/image.length
 function randomimage() {
 	currentdate = new Date()
 	image_number = currentdate.getSeconds()
 	image_number = Math.floor(image_number/rand)
 	return(image[image_number])
 }
 document.write("<img src='" + imlocation + randomimage()+ "'>");
//-->
</script>
<class="header">
</div>

<div id="main">
<img src="Images/0032.jpg" alt="My Image Description" class="align-right" width=250 height=350 />

<a href="aboutme.html">
<img src="Images/aboutmelink.jpg" alt="Link To About Me" class="align-left" width=100 height=60 /> </a>
<img src="Images/cvlink.jpg" alt="Link To C.V." class="align-left" width=100 height=60 />
<img src="Images/bloglink.jpg" alt="Link To Blog" class="align-left" width=100 height=60 />
<img src="Images/contactlink.jpg" alt="Link To Contact" class="align-left" width=100 height=60 />
<img src="Images/aboutmelinkr.jpg" alt="About Me" class="header" width=100 height=60 />

<br><br><br><br>

<p> This website is currently in production! Check back soon. </p>
</div>

<div id="footer"
</div>

</body>
</html>

Here you go!
 
Last edited:
Humm looks fine.
I don't think this is right though...
Code: 
<class="header">
</div>
The class bit should be in the <div> tag

As Mammalian says check the case of the images. Servers may be case sensitive. Your PC wont be. Also try not to use spaces in the image filenames.

Simon
 
Are the images in a folder directory that is inside the same one as the page with the script, if not the path to the files is wrong, and thats why you only get a small box.

If the images are up a level so to speak you need to change the path...

Right click on that box you mentioned choose properties, i have a feeling it's trying to render the image but the path is wrong... see what the path is that's shown when you bring up the properties.
 
You've got it t31os.
If you look at the site his images are in the same directory as the htm file.

Manic.
Either move your banner images to your Images folder and change the line:
Code: 
 var imlocation = "images/";
to
Code: 
 var imlocation = "Images/";

Or leave them where they are and change the line to:
Code: 
 var imlocation = "";

Simon
 
Ah, genius! I made the schoolboy error of editing the individual image locations, rather than the var imlocation! Thanks for the help guys, that's cleared up that problem at least :)
 
You must log in or register to reply here.
Back
Top Bottom