照片图片弹出悬浮层, 上传图片控件

查了好多资料，发现还是不全，干脆自己整理吧，至少保证在我的做法正确的，以免误导读者，也是给自己做个记录吧！

A.aspx

-----------------

----------

每日一道理
风，那么轻柔，带动着小树、小草一起翩翩起舞，当一阵清风飘来，如同母亲的手轻轻抚摸自己的脸庞，我喜欢那种感觉，带有丝丝凉意，让人心旷神怡。享受生活，不一定要有山珍海味、菱罗绸缎为伴，大自然便是上帝所赐予人类最为珍贵的。

<body> <form id="form1" runat="server"> <%-- --%> <div class="classify_div" id="classify_div" style="width: 285px;"> <div class="">  <div id="CurruntPicContainer" runat="server"> <div class="title"> <b>以后照片</b></div> <div class="photocontainer"> <asp:Image ID="imgphoto" runat="server" ImageUrl="~/image/man.GIF" /> </div> </div>  <div id="Step2Container" runat="server" visible="false"> <div class="title"> <b>裁切头像照片</b></div> <div class="uploadtooltip"> 您可以拖动照片以裁剪满足的头像</div> <div id="Canvas" class="uploaddiv"> <div id="ImageDragContainer"> <asp:Image ID="ImageDrag" runat="server" ImageUrl="~/image/blank.jpg" CssClass="imagePhoto" ToolTip="" /> </div> <div id="IconContainer"> <asp:Image ID="ImageIcon" runat="server" ImageUrl="~/image/blank.jpg" CssClass="imagePhoto" ToolTip="" /> </div> </div> <div class="uploaddiv"> <table> <tr> <td id="Min"> <img alt="缩小" src="data:image/_c.gif" οnmοuseοver="this.src='image/_c.gif';" οnmοuseοut="this.src='image/_h.gif';" id="moresmall" class="smallbig" /> </td> <td> <div id="bar"> <div class="child"> </div> </div> </td> <td id="Max"> <img alt="放大" src="data:image/c.gif" οnmοuseοver="this.src='image/c.gif';" οnmοuseοut="this.src='image/h.gif';" id="morebig" class="smallbig" /> </td> </tr> </table> </div> <%-- <input id="btnRes" type="button" οnclick="showNew()" value="恢复默许" />--%> <div class="uploaddiv"> <asp:Button ID="btn_Image" runat="server" Text="保存头像" OnClick="btn_Image_Click" /> <input id="Button1" type="button" οnclick="showNew()" value="恢复默许" /> </div> <div style="display: none"> <%-- <div>--%> 图片实际宽度： <asp:TextBox ID="txt_width" runat="server" Text="1"></asp:TextBox><br /> 图片实际高度： <asp:TextBox ID="txt_height" runat="server" Text="1"></asp:TextBox><br /> 距离顶部： <asp:TextBox ID="txt_top" runat="server" Text="82"></asp:TextBox><br /> 距离左边： <asp:TextBox ID="txt_left" runat="server" Text="73"></asp:TextBox><br /> 截取框的宽： <asp:TextBox ID="txt_DropWidth" runat="server" Text="120"></asp:TextBox><br /> 截取框的高： <asp:TextBox ID="txt_DropHeight" runat="server" Text="120"></asp:TextBox><br /> 放大倍数： <asp:TextBox ID="txt_Zoom" runat="server"></asp:TextBox> </div> </div> </div> <div class="">  <div id="Step1Container"> <div class="title"> <b>更换照片</b></div> <div id="uploadcontainer"> <div class="uploadtooltip"> 请选择新的照片文件，文件需小于2.5MB</div> <div class="uploaddiv"> <asp:FileUpload ID="fuPhoto" runat="server" ToolTip="选择照片" /></div> <div class="uploaddiv"> <asp:Button ID="btnUpload" runat="server" Text="上传" OnClick="btnUpload_Click" /></div> </div> </div> </div> </div> <%-- —%>

------------------

=======================

A.aspx.cs

//#region lei private const string savepath = "Up/Upsave" + "/"; protected void btnUpload_Click(object sender, EventArgs e) { if (fuPhoto.PostedFile != null && fuPhoto.PostedFile.ContentLength > 0) { string ext = System.IO.Path.GetExtension(fuPhoto.PostedFile.FileName).ToLower(); if (ext != ".jpg" && ext != ".jepg" && ext != ".bmp" && ext != ".gif") { return; } string filename = "near_" + DateTime.Now.ToString("yyyyMMddHHmmss") + ext; string path = "~/Up/" + filename; fuPhoto.PostedFile.SaveAs(Server.MapPath(path)); ImageDrag.ImageUrl = path; ImageIcon.ImageUrl = path; Step2Container.Visible = true; CurruntPicContainer.Visible = false; Page.ClientScript.RegisterStartupScript(this.GetType(), "ShowUploadImgDiv", "<script type='text/javascript'>;show_classify_div();</script>"); } else { //do some thing; } } protected void btn_Image_Click(object sender, EventArgs e) { int imageWidth = Int32.Parse(txt_width.Text); int imageHeight = Int32.Parse(txt_height.Text); int cutTop = Int32.Parse(txt_top.Text); int cutLeft = Int32.Parse(txt_left.Text); int dropWidth = Int32.Parse(txt_DropWidth.Text); int dropHeight = Int32.Parse(txt_DropHeight.Text); string filename = CutPhotoHelp.SaveCutPic(Server.MapPath(ImageIcon.ImageUrl), Server.MapPath(savepath), 0, 0, dropWidth, dropHeight, cutLeft, cutTop, imageWidth, imageHeight); this.imgphoto.ImageUrl = savepath + filename; this.getimage.Src = this.imgphoto.ImageUrl; Page.ClientScript.RegisterStartupScript(this.GetType(), "step3", "<script type='text/javascript'>Step3();</script>"); } //#endregion

文章结束给大家分享下程序员的一些笑话语录：神灯新篇
一个程序员在海滩上发现了一盏神灯。他在灯上擦了几下，一个妖怪就从灯里跳出来说：“我是世界上法术最强的妖怪。我可以实现你的任何梦想，但现在，我只能满足你一个愿望。”程序员摊开了一幅中东地图说：“我想让中东得到永久的和平。”妖怪答道：“哦，我没办法。自打创世纪以来，那里的战火就没有停息过。这世上几乎没有我办不到的事，但这件事除外。”程序员于是说：“好吧，我是一个程序员，为许多用户编写过程序。你能让他们把需求表述得更清楚些，并且让我们的软件项目有那么一两次按进度按成本完成吗？”妖怪说：“唔，我们还是来看中东地图吧。”

照片图片弹出悬浮层, 上传图片控件相关推荐

jquery easyui 弹出对话框被activex控件遮挡问题
为什么80%的码农都做不了架构师?>>> 参考:http://bbs.csdn.net/topics/390375764 本人遇到jquery easyui 弹出对话框被act ...
winfrom弹出窗口用timer控件控制倒计时20秒后关闭
功能描述: 因为在程序退出时需要确认是否是误操作,所以加了密码输入的子窗体,子窗体在20秒内会自动关闭代码如下: private int count;private void Form2_Load( ...
html基础总结4-实现点击图片弹出放大图片--不用插件
实现点击图片弹出放大图片--不用插件 <td width="350"> <img height="100" width="100&q ...
html5仿qq空间,JS实现的仿QQ空间图片弹出效果代码
本文实例讲述了JS实现的仿QQ空间图片弹出效果代码.分享给大家供大家参考,具体如下: function imageShow(which_click) { var image_path = which_ ...
基于layer的图片弹出展示,默认原大小展示。图片太大则等比例缩小
/**** html:<img src="img/1.jpg" onclick="showimg('img/1.jpg');">* 图片弹出展示,默 ...
ionic3 添加蒙版，弹出悬浮框
2019独角兽企业重金招聘Python工程师标准>>> 我是用ionic3做的,直接上代码,分三个文件: 1.html 1.1页面写蒙版如下 <ion-content [ngC ...
HTML中弹窗中加入图片,javascript里怎么实现点击图片弹出对话框？
JavaScript中可以使用document.getElementsByTagName方法后去img标签,然后遍历所有img标签并为其添加点击事件实现点击弹出对话框. JavaScript实现点击图 ...
html点击图片产生事件,javascript里怎么实现点击图片弹出对话框？
JavaScript中可以使用document.getElementsByTagName方法后去img标签,然后遍历所有img标签并为其添加点击事件实现点击弹出对话框. JavaScript实现点击图 ...
系出名门Android(7) - 控件(View)之ZoomControls, Include, VideoView, WebView, RatingBar, Tab
[索引页] [×××] 系出名门Android(7) - 控件(View)之ZoomControls, Include, VideoView, WebView, RatingBar, Tab, Spi ...

照片图片弹出悬浮层, 上传图片控件

照片图片弹出悬浮层, 上传图片控件相关推荐

最新文章

热门文章

照片图片弹出 悬浮层, 上传图片控件

照片图片弹出 悬浮层, 上传图片控件相关推荐

最新文章

热门文章

照片图片弹出悬浮层, 上传图片控件

照片图片弹出悬浮层, 上传图片控件相关推荐