Intro to JavaScript is a nightmare

[Alyssa Doberstein]

http://sweb1.dmit.nait.ca/~adoberstein1/DMIT218/index

This is the html, I am only permitted to change the javascript and there are a few things I need to do that I cannot figure out how to do.

-Corresponding full size images for the thumbnails must be preloaded when the application starts

-When a thumbnail is clicked, the corresponding full size image will be shown in the fullsize-image img element with an appropriate alt attribute value (same as the file name e.g. fullsize1)

-The comment control button should read Show Comments
When the full size image is hovered over with the mouse the corresponding description for the image should be displayed in the description div

-The descriptions are provided in an array in the assign1.js file and correspond in order
E.g. descriptions[0] -> thumb1.jpg

-The description div should disappear when the mouse is not hovering on the full size image

-Clicking the Show Comments button should display comments made on the image (if any have been posted) and the value of the button should change to Leave a Comment

-Bonus [2 marks]: Display in the comment area a message if there are no messages for the current image
Clicking the Leave a Comment button should bring up the comment form

-Bonus [3 marks]: prevent the image from changing when the form is displayed

-Comments should be added as li elements within the existing comments ul element

-Comments may only be posted with a valid by (required) name and comment (required) content

-Provide form validation feedback (error messages) so mistakes can be corrected

-Ensure that the error messages are placed in the designated div and that the message colour is red (use the style property for this task)

-The format for displaying posted comments is as follows:
Jon Doe on Oct 3, 2012 said: I love this picture sooooo much!
Be sure the that current date is displayed

-If a comment is successfully submitted it should immediately appear in the comments area

-If the cancel button is clicked, reset and hide the form

-Comments must persist when they are posted

-Comments that have been left must be visible when for any image on consecutive views

[William P O'Sullivan]

Welcome Alyssa, Those are a lot of questions.

Post your possible solutions and we will try to help.

WP

[Alyssa Doberstein]

The bit of javascript on there is all my code, but it doesn't seem to be doing anything. I don't think it will until the alt values are in place. I have asked other classmates and googled this but the only thing I can find is how to create this sort of img gallery using other programs. :S

[Alyssa Doberstein]

function preloadImages() {

// Create an Image object to preload images with
imageObj = null;

// Create an array of images to be preloaded
images = new Array();

images[0] = "images/fullsize1.jpg";
images[1] = "images/fullsize2.jpg";
images[2] = "images/fullsize3.jpg";
images[3] = "images/fullsize4.jpg";

// Preload each image in the array by creating a new image and
// setting the src property
for (var i = -1) {
imageObj = new Image();
imageObj.src = images[++i];
}
}


this is the closest I've gotten and it still isn't working at all...

[Bear Bibeault]

How about tackling one thing at a time and worry about getting the rest working, one at a time, afterwards. Not only is it the best way to tackle the problem, it will likely get you more help.

So pick one item, and try to get that working.

[Eric Pascarello]

well I would start by looking at your for loop.