象yhoo相册那样在网页上操作图片(不完全)_1

操作页面前台代码

< form  id ="Form1"  method ="post"  runat ="server" >
             < div  style ="BORDER-RIGHT: appworkspace 1px solid; BORDER-TOP: appworkspace 1px solid; BORDER-LEFT: appworkspace 1px solid; WIDTH: 750px; BORDER-BOTTOM: appworkspace 1px solid" >
                 <!--  tools  -->
                 < table  style ="BORDER-BOTTOM: #808080 1px solid; BACKGROUND-COLOR: #deebc6"  cellSpacing ="0"
                    cellPadding ="0"  width ="750"  border ="0" >
                     < tr >
                         < td  width ="1"  rowSpan ="6" >< spacer  type ="block"  width ="1"  height ="1" ></ td >
                         < td  width ="748"  colSpan ="23"  height ="1" >< spacer  type ="block"  width ="1"  height ="1" ></ td >
                         < td  width ="1"  rowSpan ="6" >< spacer  type ="block"  width ="1"  height ="1" ></ td >
                     </ tr >
                     < tr >
                         < td  width ="160"  colSpan ="5"  height ="10" >< spacer  type ="block"  width ="1"  height ="1" ></ td >
                         < td  width ="3"  rowSpan ="3" >< IMG  src ="Images/separator_dk.gif"  border ="0" ></ td >
                         < td  width ="420"  colSpan ="11"  height ="10" >< spacer  type ="block"  width ="1"  height ="1" ></ td >
                         < td  width ="3"  rowSpan ="3" >< IMG  src ="Images/separator_dk.gif"  border ="0" ></ td >
                         < td  width ="162"  colSpan ="5"  height ="10" >< spacer  type ="block"  width ="1"  height ="1" ></ td >
                     </ tr >
                     < tr  align ="center" >
                         < td  width ="20"  rowSpan ="2" >< spacer  type ="block"  width ="1"  height ="1" ></ td >
                         < td  width ="50" >< asp:imagebutton  id ="BrightCut"  runat ="server"  ImageUrl ="Images/minus_on.gif" ></ asp:imagebutton >< asp:imagebutton  id ="BrightAdd"  runat ="server"  ImageUrl ="Images/plus_on.gif" ></ asp:imagebutton ></ td >
                         < td  width ="20"  rowSpan ="2" >< spacer  type ="block"  width ="1"  height ="1" ></ td >
                         < td  width ="50" >< asp:imagebutton  id ="ContCut"  runat ="server"  ImageUrl ="Images/minus_on.gif" ></ asp:imagebutton >< asp:imagebutton  id ="ContAdd"  runat ="server"  ImageUrl ="Images/plus_on.gif" ></ asp:imagebutton ></ td >
                         < td  width ="20"  rowSpan ="2" >< spacer  type ="block"  width ="1"  height ="1" ></ td >
                         < td  width ="20"  rowSpan ="2" >< spacer  type ="block"  width ="1"  height ="1" ></ td >
                         < td  width ="80" >< a  onclick ="DoAutofix(); return false;"  href ="" >< IMG  alt ="自动聚焦"  src ="Images/af_on.gif"  border ="0"  name ="btnBarI4" ></ a ></ td >
                         < td  width ="20"  rowSpan ="2" >< spacer  type ="block"  width ="1"  height ="1" ></ td >
                         < td  width ="70" >< asp:imagebutton  id ="GoRr"  runat ="server"  ImageUrl ="Images/rr_on.gif" ></ asp:imagebutton >< asp:imagebutton  id ="GoRl"  runat ="server"  ImageUrl ="Images/rl_on.gif" ></ asp:imagebutton ></ td >
                         < td  width ="20"  rowSpan ="2" >< spacer  type ="block"  width ="1"  height ="1" ></ td >
                         < td  width ="50" >< a  onclick ="DoCrop(); return false;"  href ="" >< IMG  alt ="修剪"  src ="Images/crop_on.gif"  border ="0"  name ="btnBarI7" ></ a ></ td >
                         < td  width ="20"  rowSpan ="2" >< spacer  type ="block"  width ="1"  height ="1" ></ td >
                         < td  width ="50" >< a  onclick ="DoBlackEye(); return false;"  href ="" >< IMG  alt ="红色眼睛"  src ="Images/redeye_on.gif"  border ="0"  name ="btnBarI8" ></ a ></ td >
                         < td  width ="20"  rowSpan ="2" >< spacer  type ="block"  width ="1"  height ="1" ></ td >
                         < td  width ="50" >< asp:imagebutton  id ="TurnOne"  runat ="server"  ImageUrl ="Images/flip_on.gif" ></ asp:imagebutton >
                             <!-- a href="" onClick="g_PIQWidget.doCommand('flip'); return false;"><img name="btnBarI9" src="Images/flip_on.gif" border="0" alt="翻动"></a --> </ td >
                         < td  width ="20"  rowSpan ="2" >< spacer  height ="1"  width ="1"  type ="block" ></ td >
                         < td  width ="20"  rowSpan ="2" >< spacer  type ="block"  width ="1"  height ="1" ></ td >
                         < td  width ="50" >< a  onclick ="showEffects(); return false;"  href ="" >< IMG  alt ="效果"  src ="Images/effects_on.gif"  border ="0"  name ="btnBarI10" ></ a >
                         </ td >
                         < td  width ="20"  rowSpan ="2" >< spacer  type ="block"  width ="1"  height ="1" ></ td >
                         < td  width ="50" >< a  onclick ="showBorders(); return false;"  href ="" >< IMG  alt ="边界"  src ="Images/border_on.gif"  border ="0"  name ="btnBarI11" ></ a >
                         </ td >
                         < td  width ="22"  rowSpan ="2" >< spacer  type ="block"  width ="1"  height ="1" ></ td >
                     </ tr >
                     < tr  align ="center" >
                         < td >< IMG  alt ="亮度"  src ="Images/brgt.gif" ></ td >
                         < td >< IMG  alt ="对比"  src ="Images/cont.gif" ></ td >
                         < td  vAlign ="top"  noWrap >
                             < div  id ="aFixDiv" >
                                 < div  id ="aFixYDiv" >< small > 自动修复：开启 </ small >
                                 </ div >
                                 < div  id ="aFixNDiv" >< small > 自动修复：关闭 </ small >
                                 </ div >
                             </ div >
                         </ td >
                         < td >< small > 旋转 </ small ></ td >
                         < td >< small > 修剪 </ small ></ td >
                         < td  noWrap >< small > 红色眼睛 </ small ></ td >
                         < td >< small > 翻动 </ small ></ td >
                         < td >< small > 效果 </ small ></ td >
                         < td >< small > 边界 </ small ></ td >
                     </ tr >
                     < tr >
                         < td  class ="yphgryln"  colSpan ="23"  height ="1" >< spacer  type ="block"  width ="1"  height ="1" ></ td >
                     </ tr >
                     < tr >
                         < td  bgColor ="#cccccc"  colSpan ="23"  height ="1" >< spacer  type ="block"  width ="1"  height ="1" ></ td >
                     </ tr >
                 </ table >
                 <!--  /tools  -->
                 <!--  photo  -->
                 < table  cellSpacing ="0"  cellPadding ="0"  width ="750"  border ="0" >
                     < tr >
                         < td  width ="1" >< spacer  type ="block"  width ="1"  height ="1" ></ td >
                         < td >
                             < table  cellSpacing ="20"  cellPadding ="0"  width ="748"  border ="0" >
                                 < tr  valing ="top" >
                                     < td  width ="180" > 你好 世界2
                                     </ td >
                                     < td  style ="WIDTH: 215px"  width ="210"  height ="308"  rowSpan ="2" >< asp:image  id ="MyImage"  runat ="server" ></ asp:image ></ td >
                                     < td  vAlign ="top"  width ="180"  rowSpan ="2" >
                                         <!--  instruction  --> </ td >
                                 </ tr >
                                 < tr >
                                     < td  vAlign ="bottom"  noWrap >< small > 最后保存的相片 </ small >< br >
                                         < img  height ="71"  alt =""  width ="96"  align ="middle"  border ="0" ></ td >
                                 </ tr >
                             </ table >
                         </ td >
                         < td  width ="1" >< spacer  type ="block"  width ="1"  height ="1" ></ td >
                     </ tr >
                 </ table >
                 <!--  buttons  -->
                 < table  class ="yphsectbr"  cellSpacing ="0"  cellPadding ="0"  width ="750"  border ="0" >
                     < tr >
                         < td  colSpan ="4"  height ="1" >< spacer  type ="block"  width ="1"  height ="1" ></ td >
                     </ tr >
                     < tr >
                         < td  width ="1" >< spacer  type ="block"  width ="1"  height ="1" ></ td >
                         < td  colSpan ="2"  height ="4" >< spacer  type ="block"  width ="1"  height ="1" ></ td >
                         < td  width ="1" >< spacer  type ="block"  width ="1"  height ="1" ></ td >
                     </ tr >
                     < tr >
                         < td  width ="1" >< spacer  type ="block"  width ="1" ></ td >
                         < td  width ="540" >< spacer  type ="block"  width ="10" > &nbsp; </ td >
                         < td  vAlign ="top"  width ="208" >< INPUT  id ="urlStr"  style ="WIDTH: 0px; HEIGHT: 0px"  type ="hidden"  name ="urlStr"  runat ="server" >
                             < INPUT  id ="LeftTop"  style ="WIDTH: 0px; HEIGHT: 0px"  type ="hidden"  name ="LeftTop"  runat ="server" >
                             < INPUT  id ="RightTop"  style ="WIDTH: 0px; HEIGHT: 0px"  type ="hidden"  name ="RightTop"  runat ="server" >
                             < INPUT  id ="LeftBott"  style ="WIDTH: 0px; HEIGHT: 0px"  type ="hidden"  name ="LeftBott"  runat ="server" >
                             < INPUT  id ="RightBott"  style ="WIDTH: 0px; HEIGHT: 0px"  type ="hidden"  name ="RightBott"  runat ="server" >
                         </ td >
                         < td  width ="1" >< spacer  type ="block"  width ="1"  height ="1" ></ td >
                     </ tr >
                 </ table >
             </ div >
             < asp:button  id ="Button1"  style ="Z-INDEX: 101; LEFT: 128px; POSITION: absolute; TOP: 472px"  runat ="server"
                Text ="Button" ></ asp:button ></ form >

转载于:https://www.cnblogs.com/cerxp/archive/2004/12/23/80869.html