@{ Layout = null; } <html> <head> <script type="text/javascript" src="~/scripts/jquery-1.10.2.min.js"></script> <meta name="viewport" content="width=device-width,height=device-height, minimum-scale=0.1"> <style> img { text-align: center; position: absolute; margin: auto; top: 0; right: 0; bottom: 0; left: 0; } .overflowingVertical { cursor: zoom-out; } .shrinkToFit { cursor: zoom-in; } body { background-color: #272525; color: #eee; margin: 0; } </style> </head> <body> <img src="@ViewBag.PicURL" alt="@ViewBag.PicURL" onload="initImg();" /> <script> function initImg() { drawImage($("img"), document.body.clientWidth, document.body.clientHeight); } function drawImage(ImgD, FitWidth, FitHeight) { var image = new Image(); image.src = ImgD.attr("src"); if (image.width > 0 && image.height > 0) { if (image.width / image.height >= FitWidth / FitHeight) { if (image.width > FitWidth) { ImgD.css("width", FitWidth); ImgD.css("height", (image.height * FitWidth) / image.width); $("img").attr("class", "shrinkToFit"); ImgD.css("margin-top", 0); } else { ImgD.css("width", image.width); ImgD.css("height", image.height); } } else { if (image.height > FitHeight) { ImgD.css("height", FitHeight); ImgD.css("width", (image.width * FitHeight) / image.height); $("img").attr("class", "shrinkToFit"); ImgD.css("margin-top", 0); } else { ImgD.css("width", image.width); ImgD.css("height", image.height); } } } } $("img").mousedown(function () { if (typeof $(this).attr("class") != "undefined") { $(this).toggleClass("shrinkToFit overflowingVertical"); if ($(this).hasClass("overflowingVertical")) { var img = new Image(); img.src = $(this).attr("src"); var imgWidth = img.width; //图片实际宽度 var imgHeight = img.height; //图片实际高度 drawImage($(this), imgWidth, imgHeight); } if ($(this).hasClass("shrinkToFit")) { drawImage($("img"), document.body.clientWidth, document.body.clientHeight); } } }); </script> </body> </html>
后台:
/// <summary> /// 图片自适应居中打开,非图片浏览器下载 /// </summary> /// <param name="dirRelativePath">文件路径,包含文件名</param> /// <param name="fileName">文件名</param> /// <returns></returns> public ActionResult OpenPicture(string dirRelativePath, string fileName) { Regex regex = new Regex(@".jpg|.bmp|.png|.gif|.tiff"); fileName = fileName.ToLower(); var isMatch = regex.IsMatch(fileName); //图片 if (isMatch) { ViewBag.PicURL = "/Home/DownLoad?dirRelativePath=" + dirRelativePath + "&fileName=" + fileName; } else { return RedirectToAction("DownLoad", "Home", new { dirRelativePath = dirRelativePath, fileName = fileName }); } return View(); } /// <summary> /// 下载附件 /// </summary> /// <param name="dirRelativePath"></param> /// <param name="fileName"></param> /// <returns></returns> public ActionResult DownLoad(string dirRelativePath, string fileName) { string uploadPath = System.Configuration.ConfigurationManager.AppSettings["BPMAttachments"]; string dirAbsolutePath = uploadPath + dirRelativePath; if (!System.IO.File.Exists(dirAbsolutePath)) { return Content("提示:文件在磁盘上不存在"); } //HttpContext.Response.AddHeader("content-disposition", "attachment;filename=" + fileName); //return File(dirAbsolutePath, "application/octet-stream"); var contentType = MimeMapping.GetMimeMapping(fileName); HttpContext.Response.AddHeader("content-disposition", "inline;filename=" + fileName); return File(dirAbsolutePath, contentType); }