Hyperlink image

问题

I have some thumbnails that I display with a Repeater, using a hyperlink and image control. I want to be able to click on a thumbnail, display the bigger image on the same page and I want the imagename to be part of the URL. Im really stuck right now. Do I use QueryString or..?
My hyperlink now looks like this:

<asp:HyperLink ID="HyperLink" runat="server"      NavigateUrl='<%#Eval("name","Content/Images/{0}") %>' ImageUrl='<%#"Content/Thumbnails/" + Eval("Name") %>' >HyperLink</asp:HyperLink>

Edit Yes, the path to the images is: ~/Content/Images/. Here's some of my code behind, maybe it helps to explain what I'm doing.

protected void Page_Load(object sender, EventArgs e)
{
    string imgPath = Server.MapPath("~/Content/Images/");
    List<FileInfo> images = new List<FileInfo>();

    DirectoryInfo directoryInfo = new DirectoryInfo(imgPath);
    FileInfo[] fileInfo = directoryInfo.GetFiles();

    foreach (FileInfo file in fileInfo)
    {
        images.Add(file);
    }

    FileRepeater.DataSource = images;
    FileRepeater.DataBind();

}

protected void UploadButton_Click(object sender, EventArgs e)
{

    var file = ChooseFileUpload.FileContent;
    string fileName = ChooseFileUpload.FileName;

    var si = Gallery.SaveImage(file, fileName);
 }

回答1:

Yes...QueryString should be fine...it can be something like

Content/Thumbnails/page.aspx?imageName="your image name"

Update:

Where are the images stored...do they have a unique value/identity?...if yes then instead use a url of something like

Content/Thumbnails/page.aspx?imageid="your image id"

this should be the navigate url of your thumbnail image hyperlinks... and when the user clicks on a thumbnail...just make a query/call to wherever the images are stored with the id value in the querystring....you can ready querystring value by Request.QueryString["imageId"] in your case...

回答2:

I think you need to use something like this:

<bri:ThumbViewer ID="ThumbViewer2" runat="server" ImageUrl="~/images/Scissors.jpg"
                    Title="Tailors Scissors" ThumbUrl="~/thumbs/Scissors.jpg" Height="75px" Width="90px" ModalImagePadding="40px" />

As you can see in the above sample there is ImageUrl="~/images/Scissors.jpg" field which shows the actual size image after clicking on the thumbnail, and another field is ThumbUrl="~/thumbs/Scissors.jpg" which shows thumbnail image.

you can find demo here : Thumbnail-Image-Viewer-Control-for-ASP.Net

You can even find one more thread talking about this.

来源：https://stackoverflow.com/questions/9898223/hyperlink-image