Zoom su immagine

[Marcolino21]

Sono riuscito a ingrandire l'immagine al passaggio del mouse però ho un problema e spero qualcuno di voi mi posa risolvere; siccome sto in un ciclo repeater, l'ingrandimento me lo gestisce solo sulla primma immagine della prima riga. come mai ? come posso risolvere ?
Ecco il codice :

  <meta http-equiv="content-type" content="text/html; charset=utf-8" />
        <script src="jquery-1.11.1.min.js" type="text/javascript"></script>
		<script src="jquery.elevatezoom.js" type="text/javascript"></script>
        <script type="text/javascript">
            $("#zoom_01").attr('data-zoom-image', 'images/imgcat/large');
            $("#zoom_03").elevateZoom({ gallery: 'gallery_01', cursor: 'pointer', galleryActiveClass: 'active', imageCrossfade: true  });
            $("#zoom_03").bind("click", function (e) {
                var ez = $('#zoom_03').data('elevateZoom');
                $.fancybox(ez.getGalleryList()); return false;
            });      
         </script>
 <div>
 </div>
  <div id="col1">
      <asp:Repeater ID="riga" runat="server" onitemcommand="riga_ItemCommand">
              <HeaderTemplate>
                  <ul id="galleria">
              </HeaderTemplate>
              <ItemTemplate>
                  <li>
                    <img id="img_01"  src="images/imgcat/small/<%# Eval("NOMEIMAGE")  %>" border="2" vspace="6" hspace="6"  alt="" data-zoom-image="images/imgcat/large/Pizza1_L.jpg" /> 
                     <script type="text/javascript">
                                            $("#img_01").elevateZoom();
                     </script>
                      <p align="center">
                        <%# Eval("DESCRCATALOGO") %>
                     </p>
 
                  </li>
              </ItemTemplate>
              <FooterTemplate>
              </ul>
           </FooterTemplate>
 
    </asp:Repeater>


 </div>

[Marcolino21]

Allora ragazzi per rispetto di tutto il forum posto la soluzione di come ho fatto :

<asp:Content ID="Content2" ContentPlaceHolderID="ContentPlaceHolder2" Runat="Server">
    <meta http-equiv="content-type" content="text/html; charset=utf-8" />
        <script src="jquery-1.11.1.min.js" type="text/javascript"></script>
		<script src="jquery.elevatezoom.js" type="text/javascript"></script>
        <script type="text/javascript">
            $("#zoom_03").attr('data-zoom-image', 'images/imgcat/large');
            $("#zoom_03").elevateZoom({ gallery: 'gallery_01', cursor: 'pointer', galleryActiveClass: 'active', imageCrossfade: true  });
            $("#zoom_03").bind("click", function (e) {
                var ez = $('#zoom_03').data('elevateZoom');
                $.fancybox(ez.getGalleryList()); return false;
            });      
         </script>
  <div id="col1">
      <asp:Repeater ID="riga" runat="server" onitemcommand="riga_ItemCommand">
              <HeaderTemplate>
                  <ul id="galleria">
              </HeaderTemplate>
              <ItemTemplate>
                  <li>
                    <img src="images/imgcat/small/<%# Eval("NOMEIMAGE")  %>" border="2" vspace="6" hspace="6"  alt="" data-zoom-image="images/imgcat/large/<%# Eval("NIMAGELARGE") %>" /> 
               
                      <p align="center">
                        <%# Eval("DESCRCATALOGO") %>
                     </p>
                  </li>
              </ItemTemplate>
              <FooterTemplate>
                </ul>
              <script>
                 $("#galleria img").elevateZoom();
           </script> 
           </FooterTemplate>
 
    </asp:Repeater>


 </div>
 
</asp:Content>

ovviamente con la libreria javascript elevatezoom.js

Saluti