<!-- Javascript for photo swap -->

// array can contain object references, element ids, or both
var thumbIds = ["eNook_thumb_1", "eNook_thumb_2", "eNook_thumb_3", "eNook_thumb_4", "eNook_thumb_5", "eNook_thumb_6", "eNook_thumb_7", "eNook_thumb_8", "eNook_thumb_9", "eNook_thumb_10", "eNook_thumb_11", "eNook_thumb_12", "eNook_thumb_13", "eNook_thumb_14", "eNook_thumb_15", "eNook_thumb_16", "eNook_thumb_17", "eNook_thumb_18"];
var mainIds = ["Product_1", "Product_2", "Product_3", "Product_4", "Product_5", "Product_6", "Product_7", "Product_8", "Product_9", "Product_10", "Product_11", "Product_12", "Product_13", "Product_14", "Product_15", "Product_16", "Product_17", "Product_18"];

function fnCallback(e) {
      var thumbId = YAHOO.util.Event.getTarget(e).id;
      // 16 is the number of characters in the id (before the trailing number)
      var targetId = thumbId.substring(12, thumbId.length); // the number at the end of the thumbnail      
      var mainId = 'Product_' + targetId;
  
      // set all main content to hidden
      for (var i = 1; i <= mainIds.length; i++) {
            var temp = 'Product_' + i;
            document.getElementById(temp).style.visibility = 'hidden';
      }
      
      // make main content of clicked on thumb visible
      document.getElementById(mainId).style.visibility = 'visible';
}

YAHOO.util.Event.addListener(thumbIds, "click", fnCallback);