Отображение данных во всплывающем окне в asp.net

Question

Я хочу показать данные во всплывающем окне. всплывающее окно будет показано нажатием на изображение. но данные не отображаются.

JavaScript коды:

<script type="text/javascript"> 
    $(document).ready(function() { 
     $('.popup').click(function() { 
      $('.box').show("slow"); 
      $('.close').show("slow"); 
     }) 
     $('.close').click(function() { 
      $('.box').hide("slow"); 
     }) 
    }) 
</script> 

щелчком на image1 всплывающем окне шоу и, нажав на изображение 11 изображение sould будет показывать в всплывающем окне, но не работает.

<asp:Image ID="Image1" runat="server" CssClass="popup" /> 
<div class="box"> 
    <div class="close"> 
     × 
    </div> 
    <center> 

    <asp:Image ID="Image11" runat="server" CssClass=bigpic /> 
    </center> 
</div> 

изображение показывается, но быстро исчезает!

Answer 1

Вы можете использовать библиотеку JQuery UI, чтобы отобразить всплывающее окно, вот пример:

Javascript:

<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min.js' type="text/javascript"></script> 
<script src="http://code.jquery.com/ui/1.11.1/jquery-ui.min.js"></script> 
<link href="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.11.4/jquery-ui.css" rel="stylesheet" /> 
<script type="text/javascript"> 
    $(document).ready(function() { 
     $('.popup').click(function() { 
      $(".box").dialog({ 
       title: "jQuery Dialog Popup", 
       buttons: { 
        Close: function() { 
         $(this).dialog('close'); 
        } 
       }, 
       modal: true 
      }); 
     }); 
    }); 
</script> 

.aspx:

<asp:Image ID="Image1" runat="server" CssClass="popup" ImageUrl="~/Images/img1.jpg" /> 
<div class="box"> 
    <asp:Image ID="Image11" runat="server" CssClass="bigpic" /> 
</div>