在小面板中的大图像(图像在面板外面)

问题描述:

我向ASP面板添加了一个大图像,并且它离开了面板。我想在没有滚动条的面板中的图像,并在与JavaScript面板中移动它。我怎样才能做到这一点。这是我的代码在小面板中的大图像(图像在面板外面)

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="move background.aspx.cs" Inherits="move_background" %> 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 

<html xmlns="http://www.w3.org/1999/xhtml"> 
<head id="Head1" runat="server"> 
<title></title> 
<script type="text/javascript"> 
    Hmove = 12; 
    function moveObjRight(obj) { 
     var a = document.getElementById(obj); 
     var Left = parseInt(a.style.left); 
     var newpo = Left + Hmove; 
     a.style.left = newpo + "px"; 

    } 
</script> 

</head> 
<body> 
<form id="form1" runat="server"> 

    <asp:Panel ID="Panel1" runat="server" Height="133px" 
     style="z-index: 1; left: 0px; top: 0px; position: absolute; height: 500px; width: 1000px" 
     Width="166px" ForeColor="#990000" BackColor="#0066FF" 
     Direction="LeftToRight" HorizontalAlign="Left"> 

    <img alt="asd" src="Pictures/view.gif" id="AS" style="z-index: 1; left:100px; top:100px; position: relative"/> 'BIG IMAGE' 
    <img alt="move left" src="" id="moveleft" onclick="javascript:moveObjRight('AS');" 
     style="z-index: 1; left: 222px; top: 264px; position: absolute; height: 33px; width: 34px;"/> 
    </asp:Panel> 

</form> 
</body> 
</html> 

将样式overflow:hidden;添加到面板。