Showing multiple ImageViewers in MVC5 - Running into trouble trying to show two ImageViewers

I added a second div to hold a second image
<table style="width:100%">
<tr>
<td style="width:60%">
<div id="imageViewerDiv" style="width:100%"></div>
</td>
<td>
<div id="imageViewerDiv2" style="width:100%"></div>
</td>
</tr>
</table>

and then in the java I added code to put the image in both image viewers
var imageViewer2 = null;
var imageViewer = null;

window.onload = function () {
// Get the container DIV
var imageViewerDiv = document.getElementById("imageViewerDiv");

// Create the image viewer inside it
var createOptions = new lt.Controls.ImageViewerCreateOptions(imageViewerDiv);
imageViewer = new lt.Controls.ImageViewer(createOptions);
imageViewer.defaultInteractiveMode = new lt.Controls.ImageViewerPanZoomInteractiveMode();
// Add handler to show an alert on errors
imageViewer.itemError.add(function (sender, e) {
alert("Error loading " + e.data.srcElement.src);
});
// Load an image in the viewer
imageViewer.imageUrl = "/Images/Cannon.jpg";



var imageViewerDiv2 = document.getElementById("imageViewerDiv2");

// Create the image viewer inside it
var createOptions2 = new lt.Controls.ImageViewerCreateOptions(imageViewerDiv2);
imageViewer2 = new lt.Controls.ImageViewer(createOptions2);
imageViewer2.defaultInteractiveMode = new lt.Controls.ImageViewerPanZoomInteractiveMode();
// Add handler to show an alert on errors
imageViewer2.itemError.add(function (sender, e) {
alert("Error loading " + e.data.srcElement.src);
});
// Load an image in the viewer
imageViewer2.imageUrl = "/Images/Cannon.jpg";

};

But no matter what I do I still only see the first image. Any idea on what I am missing?

Hi,

Can you clarify what you mean by "But no matter what I do I still only see the first image."?

I took your code a created a simple sample project out of it. I did notice that you were missing height values on your elements (which was causing the body to be only 6 pixels tall) but after adding those heights, I was able to see the cannon.jpg image in both viewers:



I have attached the small sample project that I created from your code as a reference.

Yup Height was the problem. Thanks.