none
关于ajaxToolkit中的AlwaysVisibleControlExtender RRS feed

  • 问题

  • 问题描述:我使用了AjaxToolkit中的AlwaysVisibleControlExtender,但发现当页面出现纵向滚动条时,AlwaysVisibleControlExtender指定的控件不会固定在我指定的位置,而是随页面的上下滚动而滚动。这是为什么?按书上说是会固定在我指定的位置上而不随页面的纵向滚动而滚动。参考书是由陈黎夫所著的《ASP.NET AJAX程序设计 第I卷:服务器端ASP.NET 2.0 AJAX Extensions与ASP.NET AJAX Control Toolkit》一书。代码如下:

     

    <aspTongue TiedcriptManager ID="ScriptManager1" runat="server" />
            <div>
                <ajaxToolkit:AlwaysVisibleControlExtender ID="avce" runat="server" TargetControlID="myLogin" HorizontalSide="left" HorizontalOffset="50" VerticalSide="top" VerticalOffset="50" />
                <asp:Login ID="myLogin" CssClass="login" runat="server" />
                <div>
                    <p>
                        AlwaysVisibleControl Demo.AlwaysVisibleControl Demo.AlwaysVisibleControl Demo.AlwaysVisibleControl Demo
                    </p>
                    <p>
                        AlwaysVisibleControl Demo.AlwaysVisibleControl Demo.AlwaysVisibleControl Demo.AlwaysVisibleControl Demo
                    </p>
                    <p>
                        AlwaysVisibleControl Demo.AlwaysVisibleControl Demo.AlwaysVisibleControl Demo.AlwaysVisibleControl Demo
                    </p>
                    <p>
                        AlwaysVisibleControl Demo.AlwaysVisibleControl Demo.AlwaysVisibleControl Demo.AlwaysVisibleControl Demo
                    </p>
                    <p>
                        AlwaysVisibleControl Demo.AlwaysVisibleControl Demo.AlwaysVisibleControl Demo.AlwaysVisibleControl Demo
                    </p>
                    <p>
                        AlwaysVisibleControl Demo.AlwaysVisibleControl Demo.AlwaysVisibleControl Demo.AlwaysVisibleControl Demo
                    </p>
                    <p>
                        AlwaysVisibleControl Demo.AlwaysVisibleControl Demo.AlwaysVisibleControl Demo.AlwaysVisibleControl Demo
                    </p>
                    <p>
                        AlwaysVisibleControl Demo.AlwaysVisibleControl Demo.AlwaysVisibleControl Demo.AlwaysVisibleControl Demo
                    </p>
                    <p>
                        AlwaysVisibleControl Demo.AlwaysVisibleControl Demo.AlwaysVisibleControl Demo.AlwaysVisibleControl Demo
                    </p>
                    <p>
                        AlwaysVisibleControl Demo.AlwaysVisibleControl Demo.AlwaysVisibleControl Demo.AlwaysVisibleControl Demo
                    </p>
                    <p>
                        AlwaysVisibleControl Demo.AlwaysVisibleControl Demo.AlwaysVisibleControl Demo.AlwaysVisibleControl Demo
                    </p>
                    <p>
                        AlwaysVisibleControl Demo.AlwaysVisibleControl Demo.AlwaysVisibleControl Demo.AlwaysVisibleControl Demo
                    </p>
                    <p>
                        AlwaysVisibleControl Demo.AlwaysVisibleControl Demo.AlwaysVisibleControl Demo.AlwaysVisibleControl Demo
                    </p>
                    <p>
                        AlwaysVisibleControl Demo.AlwaysVisibleControl Demo.AlwaysVisibleControl Demo.AlwaysVisibleControl Demo
                    </p>
                    <p>
                        AlwaysVisibleControl Demo.AlwaysVisibleControl Demo.AlwaysVisibleControl Demo.AlwaysVisibleControl Demo
                    </p>
                    <p>
                        AlwaysVisibleControl Demo.AlwaysVisibleControl Demo.AlwaysVisibleControl Demo.AlwaysVisibleControl Demo
                    </p>
                    <p>
                        AlwaysVisibleControl Demo.AlwaysVisibleControl Demo.AlwaysVisibleControl Demo.AlwaysVisibleControl Demo
                    </p>
                    <p>
                        AlwaysVisibleControl Demo.AlwaysVisibleControl Demo.AlwaysVisibleControl Demo.AlwaysVisibleControl Demo
                    </p>
                    <p>
                        AlwaysVisibleControl Demo.AlwaysVisibleControl Demo.AlwaysVisibleControl Demo.AlwaysVisibleControl Demo
                    </p>
                    <p>
                        AlwaysVisibleControl Demo.AlwaysVisibleControl Demo.AlwaysVisibleControl Demo.AlwaysVisibleControl Demo
                    </p>
                    <p>
                        AlwaysVisibleControl Demo.AlwaysVisibleControl Demo.AlwaysVisibleControl Demo.AlwaysVisibleControl Demo
                    </p>
                    <p>
                        AlwaysVisibleControl Demo.AlwaysVisibleControl Demo.AlwaysVisibleControl Demo.AlwaysVisibleControl Demo
                    </p>
                    <p>
                        AlwaysVisibleControl Demo.AlwaysVisibleControl Demo.AlwaysVisibleControl Demo.AlwaysVisibleControl Demo
                    </p>
                    <p>
                        AlwaysVisibleControl Demo.AlwaysVisibleControl Demo.AlwaysVisibleControl Demo.AlwaysVisibleControl Demo
                    </p>
                    <p>
                        AlwaysVisibleControl Demo.AlwaysVisibleControl Demo.AlwaysVisibleControl Demo.AlwaysVisibleControl Demo
                    </p>
                    <p>
                        AlwaysVisibleControl Demo.AlwaysVisibleControl Demo.AlwaysVisibleControl Demo.AlwaysVisibleControl Demo
                    </p>
                    <p>
                        AlwaysVisibleControl Demo.AlwaysVisibleControl Demo.AlwaysVisibleControl Demo.AlwaysVisibleControl Demo
                    </p>
                    <p>
                        AlwaysVisibleControl Demo.AlwaysVisibleControl Demo.AlwaysVisibleControl Demo.AlwaysVisibleControl Demo
                    </p>
                    <p>
                        AlwaysVisibleControl Demo.AlwaysVisibleControl Demo.AlwaysVisibleControl Demo.AlwaysVisibleControl Demo
                    </p>
                    <p>
                        AlwaysVisibleControl Demo.AlwaysVisibleControl Demo.AlwaysVisibleControl Demo.AlwaysVisibleControl Demo
                    </p>
                    <p>
                        AlwaysVisibleControl Demo.AlwaysVisibleControl Demo.AlwaysVisibleControl Demo.AlwaysVisibleControl Demo
                    </p>
                </div>
            </div>

     

    样式文件StyleSheet.css:

    .login
    {
     background-color: #fff;
     border: 2px solid #000;
     position: absolute;
     left: 10px;
     top: 50px;
    }

    请知道问题所在的朋友帮忙指点下我,谢谢先:)

    2009年1月25日 1:51

答案

  • 你好,

    这是由于AlwaysVisibleControlExtender的js对IE兼容不是很好造成的。你可以用其他浏览器试验一下。就目前来说如果使用AlwaysVisibleControlExtender的话最好还是用Panel作为Target. 其实更加简单的方式是直接设置style. AlwaysVisibleControlExtender对IE 7以上的浏览器页就是把target element的position设置为fixed.

     

    Code Snippet
    <asp:Login style="position:fixed" ID="Login1" runat="server" BackColor="Yellow" BorderColor="Red">

     

     

     

    2009年1月28日 8:57
    版主

全部回复

  • 你好,

     

    请设置 TargetControlID为Panel 的ID。然后可以吧Login控件放到Panel中。如下:

     

    Code Snippet

    <asp:ScriptManager ID="ScriptManager1" runat="server">

    </asp:ScriptManager>

    <asp:Panel ID="Panel1" runat="server">

    <asp:Login ID="Login1" runat="server" BackColor="Yellow" BorderColor="Red">

    </asp:Login>

    </asp:Panel>

    <cc1:AlwaysVisibleControlExtender ScrollEffectDuration=".1" HorizontalSide=Right HorizontalOffset=10

    VerticalSide="Middle" VerticalOffset="10" ID="Login1_AlwaysVisibleControlExtender"

    runat="server" TargetControlID="Panel1">

    </cc1:AlwaysVisibleControlExtender>

     

     

    2009年1月27日 5:17
    版主
  • To:Allen Chen - MSFT:谢谢您的回复。按您指导得,我已试过,成功了。但我有一个问题,我又看了下书,发现书上的代码并没有Panel,为什么书上不加Panel可以,我得就不行呢?难道是书上写错了?

    2009年1月28日 1:48
  • 你好,

    这是由于AlwaysVisibleControlExtender的js对IE兼容不是很好造成的。你可以用其他浏览器试验一下。就目前来说如果使用AlwaysVisibleControlExtender的话最好还是用Panel作为Target. 其实更加简单的方式是直接设置style. AlwaysVisibleControlExtender对IE 7以上的浏览器页就是把target element的position设置为fixed.

     

    Code Snippet
    <asp:Login style="position:fixed" ID="Login1" runat="server" BackColor="Yellow" BorderColor="Red">

     

     

     

    2009年1月28日 8:57
    版主