Javascript hosting not working...

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:

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:
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 :)
 
Back
Top Bottom