Alterar foto com javascript

[Henrique Gouvêa 0]

É o seguinte, eu tenho uma página em ASP.NET, e nela tenho uma foto principal com zoom em javascrip

e uma ListView com as miniaturas das outras fotos do produto. Quando clico nas miniaturas, a foto principal é alterada pelo evento do botão em C#.

 

ASP.NET

<asp:HyperLink ID="lnkMainLightbox2" runat="server" CssClass="cloud-zoom">
         <asp:Image id="defaultImage" runat="server" />
</asp:HyperLink> 

 

C#

protected void imageButton_click(object sender, ImageClickEventArgs e) 
{
      ImageButton imageButtonSelecionado = (ImageButton)sender;   
      this.defaultImage.ImageUrl = imageButtonSelecionado.DescriptionUrl;
      lnkMainLightbox2.Attributes["href"] = imageButtonSelecionado.AlternateText;
}

 

Só que eu não quero que de postback, então resolvi fazer por javascript:

 

No OnLoad da página adiciono o atributo onclick em cada miniatura da foto na lista

foreach (ListViewItem lvi in lvProductPictures.Items)
{
   var imageButton = (ImageButton)lvi.FindControl("imageButton");
   imageButton.Attributes.Add("OnClick", ("UpdateMainImage('" + imageButton.DescriptionUrl + "', '" + imageButton.AlternateText +"'); return false;"));
}

 

E na página html deixei a função:

function UpdateMainImage(url, zoom) {
      var linkZoom = document.getElementById('<%=lnkMainLightbox2.ClientID%>');
      var imgMain = document.getElementById('<%=defaultImage.ClientID%>');
      linkZoom.setAttribute("href", zoom);
      imgMain.src = url;
}

 

A foto está trocando normal, mas o zoom não troca. O zoom fica sempre da primeira foto. Não manjo muito de javascript, não sei o que estou fazendo de errado.

Também tenho javascripts do zoom na página:

 

<script language="javascript" type="text/javascript">

           $(document).ready(function () {
               $('.cloud-zoom').jqzoom();
           });  

           jQuery(document).ready(function($){
            var options = {
                zoomWidth:300,
                zoomHeight: 200,
                   xOffset: 20,
                   yOffset: 0,
                   position: "right",
                   zoomType: 'standard',
                   lens:true,
                   frameWidth: 500,
                   frameHeight: 600
               };
               $('.cloud-zoom').jqzoom(options);
           });

</script>

 

Se alguém puder me dar uma força eu agradeço desde já.

[Ted k' 126]

Por que não chama a função de zoom dento da função UpdateMainImage()?