Upload an image to generate a thumbnail, and use jquery to move the mouse to the thumbnail to display the corresponding large image.

Source: Internet
Author: User
Tags bmp image

Code

HTML code
<Head runat = "server"> <SCRIPT type = "text/JavaScript" src = "script/jquery-1.3.2-vsdoc2.js"> SCRIPT> <link href = "CSS/btn.css" type = "Text /CSS "rel =" stylesheet "/> <title> head> <body> <Form ID =" form1 "runat =" server "> <div> <asp: fileupload id = "fileup" runat = "server" cssclass = "green1"/> <asp: button id = "btnup" runat = "server" text = "Upload" cssclass = "green1" onclick = "btnup_click"/> <br/> <asp: panel id = "Panel1" runat = "server"> Asp: Panel> <asp: image id = "imshow" runat = "server" imageurl = "images/3f76deb8623b1.jpg" width = "300px"/> div> <SCRIPT type = "text/JavaScript"> var $ ur = $ ("# imshow "). ATTR ("src") $ ("image [SRC * = 'ico ']"). hover (function () {var $ url = $ (this ). ATTR ("src"); $ ("# imshow "). ATTR ("src", $ URL) ;}, function () {$ ("# imshow "). ATTR ("src", $ ur) ;}; SCRIPT> form> body> HTML>

Code
 

C # code
Public void queryico () {string Path = server. mappath ("~ /Images "); directoryinfo dirinfo = new directoryinfo (server. mappath ("~ /ICO "); fileinfo [] files = dirinfo. getfiles ("*. jpg "); foreach (fileinfo file in files) {system. web. UI. webcontrols. image im = new system. web. UI. webcontrols. image (); Im. imageurl = "ICO/" + file. name; this. panel1.controls. add (IM); If (panel1.controls. count % 4 = 0) {// wrap this dynamically in the panel. panel1.controls. add (New literalcontrol ("") ;}} protected void btnup_click (Object sender, eventargs e) {// get the upload path St Ring Path = server. mappath ("images/"); // obtain the application virtual path // string path1 = applicationpath + "/images/"; string path2 = server. mappath ("~ /ICO/"); string type = system. Io. Path. getextension (fileup. filename). tolower (); If (fileup. hasfile) {If (type! = ". Jpg ") {response. write ("");} else {string filename = This. fileup. filename; If (fileup. postedfile. contentlength> 1024*2*1024) {response. write ("");} else {fileup. saveas (path + fileup. filename); this. imshow. imageurl = "images/" + fileup. filename; makesmallimg (fileup. postedfile. inputstream, path2 + filename, 100,200); // response. write (""); queryico () ;}}// generate a thumbnail Based on the template ratio (obtain the source file as a stream) // generate a thumbnail function // sequence parameters: source image file stream, thumbnail storage address, template width, template height // note: the thumbnail size is controlled in the template area public static void makesmallimg (system. io. stream fromfilestream, string filesaveurl, system. double templatewidth, system. double templateheight) {// obtain the image object from the file and use the color management information embedded in the stream system. drawing. image myimage = system. drawing. image. fromstream (fromfilestream, true); // system with thumbnail width and height. double newwidth = myimage. width, newheight = myimage. height; // If (myimage. width> myimage. height | myimage. width = myimage. height) {If (myimage. width> templatewidth) {// width: Based on the template, and height: proportional Scaling: newwidth = templatewidth; newheight = myimage. height * (newwidth/myimage. width) ;}}// the vertical figure else {If (myimage. height> templateheight) {// The height is based on the template, and the width is scaled proportionally. newheight = templateheight; newwidth = myimage. width * (newheight/myimage. height) ;}// obtain the image size system. drawing. size mysize = new size (INT) newwidth, (INT) newheight); // create a BMP image system. drawing. image bitmap = new system. drawing. bitmap (mysize. width, mysize. height); // create a canvas system. drawing. graphics G = system. drawing. graphics. fromimage (Bitmap); // set the high quality interpolation method G. interpolationmode = system. drawing. drawing2d. interpolationmode. high; // set high quality, low speed rendering smoothness G. smoothingmode = system. drawing. drawing2d. smoothingmode. highquality; // clear the canvas G. clear (color. white); // draw at the specified position G. drawimage (myimage, new system. drawing. rectangle (0, 0, bitmap. width, bitmap. height), new system. drawing. rectangle (0, 0, myimage. width, myimage. height), system. drawing. graphicsunit. pixel); // text watermark // system. drawing. graphics G = system. drawing. graphics. fromimage (Bitmap); // system. drawing. font F = new font ("", 10); // system. drawing. brush B = new solidbrush (color. black); // G. drawstring ("myohmine", F, B, 10, 10); // G. dispose (); // image watermark // system. drawing. image copyimage = system. drawing. image. fromfile (system. web. httpcontext. current. server. mappath ("PIC/1.gif"); // graphics A = graphics. fromimage (Bitmap); //. drawimage (copyimage, new rectangle (bitmap. width-copyImage.Width, bitmap. height-copyImage.Height, copyimage. width, copyimage. height), 0, 0, copyimage. width, copyimage. height, graphicsunit. pixel); // copyimage. dispose (); //. dispose (); // copyimage. dispose (); // Save the thumbnail bitmap. save (filesaveurl, system. drawing. imaging. imageformat. JPEG); G. dispose (); myimage. dispose (); bitmap. dispose ();}

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.