小面板中的大图像(图像离开面板)

时间:2011-04-17 08:08:47

标签: asp.net

我将一个大图像添加到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>

1 个答案:

答案 0 :(得分:0)

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