Here i have created smaple for you that full fill your requirement.
HTML
<div>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<script type="text/javascript">
function LoadDiv(src) {
$('[id*=pop]').find('[id*=Image1]').attr('src', src);
$('[id*=pop]').show();
return false;
}
</script>
<asp:Repeater ID="Repeater5" runat="server" OnItemDataBound="Repeater5_ItemDataBound">
<HeaderTemplate>
<table>
</HeaderTemplate>
<ItemTemplate>
<%# (Container.ItemIndex + 5) % 5 == 0 ? "<tr>" : string.Empty%>
<td>
<table>
<tr>
<td>
<div class="datalisttable" style="margin-left: 10px; margin-right: 10px; width: 200px;
text-align: center;" data-animation="fadeInDown" data-animation-delay="01">
<div class="image" style="display: none; float: left; width: 50px; z-index: 999;
position: absolute; right: 0; top: 0;">
<asp:Repeater ID="Repeater2" runat="server" DataMember="">
<ItemTemplate>
<table style="margin-bottom: 5px;">
<tr>
<td>
<%--<asp:Image ID="Image2" runat="server" ImageUrl='<%# Eval("Picture") %>' Width="50px" Height="60px" style ="cursor:pointer"/>--%>
<asp:ImageButton ID="imgbtnjourpic" runat="server" CommandArgument='<%# Eval("Pic_ID") %>'
ImageUrl='<%# Eval("Picture") %>' Width="50px" Height="60px" Style="cursor: pointer" />
</td>
</tr>
</table>
</ItemTemplate>
</asp:Repeater>
</div>
<table cellspacing="1" class="nav-justified" style="text-align: center; width: 100%">
<tr>
<td>
<asp:Label ID="PictureUrlLabel" runat="server" Text='<%# Eval("Picture") %>' Visible="false"></asp:Label>
<asp:Image ID="Image1" runat="server" Height="180px" ImageUrl='<%# Eval("Picture") %>'
Width="150px" onclick="LoadDiv(this.src)" />
<asp:Label ID="ProductID" runat="server" Text='<%# Eval("Jour_ID") %>' Visible="false"></asp:Label>
</td>
</tr>
<tr>
<td>
<asp:Label ID="NameLabel" runat="server" Text='<%# Eval("JourName") %>' />
شماره ی
<asp:Label ID="lblnum" runat="server" Text='<%# Eval("JourNum") %>' />
</td>
</tr>
<tr>
<td>
تاریخ:
<asp:Label ID="Label2" runat="server" Text='<%# Eval("JourDate") %>'></asp:Label>
</td>
</tr>
<tr>
<td>
<asp:Label ID="PriceLabel" runat="server" Text='<%# Eval("JourPrice") %>' /> تومان
</td>
</tr>
</table>
</td>
</tr>
</table>
<br />
</div>
</td>
<%# (Container.ItemIndex + 5) % 5 == 4 ? "</tr>" : string.Empty%>
</ItemTemplate>
<FooterTemplate>
</table></FooterTemplate>
</asp:Repeater>
<div runat="server" id="pop" style="display: none; text-align: center; background-color: rgba(10,10,10,0.7);
height: 10%; width: 10%; top: 0; left: 0; right: 0; z-index: 100000000000001;
bottom: 0; background-color: rgba(10,10,10,0.7);">
<table class="log" align="center" style="margin-top: 10px; background-color: white;">
<tr>
<td align="right">
<a class="close" style="color: #aaa; font-size: 22px; cursor: pointer;">×</a>
</td>
</tr>
<tr>
<td>
<asp:Image ID="Image1" runat="server" Width="200px" Height="200px" />
</td>
</tr>
</table>
</div>
</div>
Code
protected void Page_Load(object sender, EventArgs e)
{
DataTable dt = new DataTable();
dt.Columns.AddRange(new DataColumn[6] { new DataColumn("Picture", typeof(string)),
new DataColumn("Jour_ID", typeof(int)),
new DataColumn("JourName",typeof(string)),
new DataColumn("JourNum",typeof(int)),
new DataColumn("JourDate",typeof(DateTime)),
new DataColumn("JourPrice",typeof(float))});
dt.Rows.Add("~/images/Desert.jpg", 1, "Desert", 101, "2015-06-06", 1200);
dt.Rows.Add("~/images/Koala.jpg", 2, "Koala", 102, "2015-06-07", 1300);
dt.Rows.Add("~/images/Penguins.jpg", 3, "Penguins", 103, "2015-06-08", 1400);
Repeater5.DataSource = dt;
Repeater5.DataBind();
}
protected void Repeater5_ItemDataBound(object sender, RepeaterItemEventArgs e)
{
if (e.Item.ItemType == ListItemType.Item || e.Item.ItemType == ListItemType.AlternatingItem)
{
Repeater Repeater2 = e.Item.FindControl("Repeater2") as Repeater;
Repeater2.DataSource = GetData();
Repeater2.DataBind();
}
}
private DataTable GetData()
{
DataTable dt = new DataTable();
dt.Columns.AddRange(new DataColumn[2] { new DataColumn("Pic_ID", typeof(int)),
new DataColumn("Picture", typeof(string))});
dt.Rows.Add(1, "~/images/Desert.jpg");
dt.Rows.Add(2, "~/images/Koala.jpg");
dt.Rows.Add(3, "~/images/Penguins.jpg");
return dt;
}
Screenshot
