象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"><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"><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"><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"><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"><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/p/80869.html