The product.html file includes a drop down list where the user can select the desired product type.
<html>
<head>
<script>
<!--
function selectProduct() {
var e = document.productForm.selProduct;
parent.categoryFrame.location = e.options[e.selectedIndex].value;
parent.itemFrame.location = "item-initial";
}
//-->
</script>
</head>
<body>
<form name="productForm">
<font size="-1">Product:<br></font>
<select name="selProduct" onChange="selectProduct();">
<option value="cat-cd.html">CDs</option>
<option value="cat-record.html">Records</option>
<option value="cat-tape.html">Tapes</option>
</select>
</form>
</body>
</html>
|
The drop down list defined here has three options labelled "CDs", "Records" and "Tapes".
When the user selects a new product type, the function selectProduct is called. This function loads the HTML file specified by the value of the selected option into the category frame. The item-initial.html file is then loaded into the item frame.
If you find this tutorial useful and want to show your apprectiation, a small donation is most welcome.
