This is the question asked to me by My Friend Mr.Kush N Thakkar and Mr.Ajay Chauhan if I am replying late then sorry else have a look:
You can follow below process:
- Download whole project
- Add images,css and js folder in to your solution explorer.
- Add a new page.
- Add below lines under head section :
<link rel="stylesheet" href="css/lightbox.css" type="text/css" media="screen" />
<script src="js/prototype.js" type="text/javascript"></script>
<script src="js/scriptaculous.js?load=effects" type="text/javascript"></script>
<script src="js/lightbox.js" type="text/javascript"></script>
5. Before place any control of asp.net Add below line:
<a href="images/image-1.jpg" rel="lightbox"> </a>
6. Now ,add an asp.net image control under the anchor <a></a> tag like below :
<a href="images/image-1.jpg" rel="lightbox">
<asp:Image ID="Image1" runat="server" ImageUrl="images/thumb-1.jpg" Width="100" Height="55"/></a>
7. Add below lines in to a div:
<a href="images/image-1.jpg" rel="lightbox">
<asp:Image ID="Image1" runat="server" ImageUrl="images/thumb-1.jpg" Width="100"Height="55" />
</a>
<a href="images/1.jpg" rel="lightbox">
<asp:Image ID="Image2" runat="server" ImageUrl="images/1 -thumb.jpg"Width="100" Height="55"/> </a>
<a href="images/2.jpg" rel="lightbox">
<asp:Image ID="Image3" runat="server" ImageUrl="images/2-thumb.jpg" width="100"height="55" />
</a>
Here I use three different sizes of images in the same size of asp.net image control.
Save all the work and view the page in browser if something you want to edit or modify write codes in css or js or ask to me.
I am a passionate programmer and a Software Engineer love blogging and developing applications in Microsoft Technologies.
ConversionConversion EmoticonEmoticon