I’m a multimedia major and I don’t know much besides actionscript and we’re required to do a javascript project. Problem is it’s due tonight and I don’t know much about javascript. If someone can help me build the script for this I’d appreciate it.
Project: When your html page loads, it should present the user with a product image, two buttons (next, previous), a series of input components, a text description, a text product title, and a text price element. The elements should interoperate as follows:
1.
The Javascript code should include an array of objects, where each element in the array represents one item in the catalog.
Each catalog item must have a product title, image URL, and text description.
Each catalog item must also have some form of optional modification selections (size: S, M, L), color: red, white, black, etc.
Each catalog item must have a price associated with each optional selection.
When the catalog page is loaded, the first item in the catalog and all of its information should be displayed. The optional selection should initially default to the first option (S, red, etc.).
When an item is displayed, the image must be displayed in the catalog IMG tag, the title and description text must be displayed in standard HTML components by modifying the .innerHTML property of a HTML element.
When an item is displayed, the optional selections must be displayed in standard HTML components (checkboxes, select/option tags, etc.).
When the optional selection is modified, the updated price information must be displayed in the appropriate HTML element.
The two buttons (next, previous) should modify the catalog to view the next/previous item in the array. The catalog may stop at the ends of the list or wrap-around at the discretion of the implementer.
// This is what I have so far (not much) :
<html>
<head>
<title>Catalogue</title>
<script type=”text/javascript” language=”javascript”>
<!–
var pics = 0
var pics = [“pics/pic1.jpg”, “pics/pic2.jpg”, “pics/pic3.jpg”, “pics/pic4.jpg”]
function flip() {
pic = (pic+1)%pics.length
document.images[0].src = pics[pic]
}
–>
</script>
</head>
<body>
<img src=”pics/pic1.jpg” />
<button onClick=”javascript:flip()”>Next</button>
</body>
</html>
—Thank you in advance!