zoukankan      html  css  js  c++  java
  • ajax的loading显示在gridview的位置

    <body>
        
    <form id="form1" runat="server">
        
    <asp:ScriptManager ID="ScriptManager1" runat="server">
        
    </asp:ScriptManager>
        
    <asp:UpdatePanel ID="UpdatePanel1" runat="server">
            
    <ContentTemplate>
                
    <div style="background-color:Beige;">
                    
    <asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="False" 
                        DataSourceID
    ="AccessDataSource1">
                        
    <Columns>
                            
    <asp:BoundField DataField="图书简介" HeaderText="图书简介" SortExpression="图书简介" />
                            
    <asp:BoundField DataField="图书名称" HeaderText="图书名称" SortExpression="图书名称" />
                            
    <asp:BoundField DataField="作者" HeaderText="作者" SortExpression="作者" />
                        
    </Columns>
                    
    </asp:GridView>
                    
    <div style="position:absolute; top:100px; left:300px; font-size:40px; color:Red;">
                        
    <asp:UpdateProgress ID="UpdateProgress1" runat="server">
                            
    <ProgressTemplate>
                                
    <div>更新数据,请稍候……</div>
                            
    </ProgressTemplate>
                        
    </asp:UpdateProgress>
                    
    </div>
                    
                
    </div>
                
    <asp:Button ID="Button1" runat="server" Text="Button" onclick="Button1_Click" />
            
    </ContentTemplate>
        
    </asp:UpdatePanel>
        
    <asp:AccessDataSource ID="AccessDataSource1" runat="server"  DataFile="~/App_Data/电子交易.mdb" 
             SelectCommand
    ="SELECT [图书简介], [图书名称], [作者] FROM [书籍信息]">
        
    </asp:AccessDataSource>
        
    </form>
        
    </body>

    页面上用到了UpdateProgress,以便在进行各种操作时显示一个等待图标,给用户解解闷,好让他们在漫长的等待结果的岁月中不那么烦躁,知道系统正在忙。

    形如:

    <asp:UpdateProgress ID="UpdateProgress1" runat="server" >

        
    <ProgressTemplate>

        
    <img src="../images/loading.gif" alt="请稍候" />

    </ProgressTemplate>

    </asp:UpdateProgress>

    可是这样写的话图标就歪在一边,不显眼。如果写上个绝对定位,比如

    style
    ="position:absolute;left:400px;top:300px;",可这仅仅适合800*600的屏幕,而用户的屏幕分辨率千差万别。

    最后发觉可以用百分比,这样写:

    <asp:UpdateProgress ID="UpdateProgress1" runat="server" >

        
    <ProgressTemplate>

        
    <img src="../images/loading.gif" alt="请稍候" style="position:absolute;left:50%;top:50%;"/>

    </ProgressTemplate>

    </asp:UpdateProgress>
  • 相关阅读:
    模块化+定制化,PIX赋能多种行业实现低速无人车商业化
    支持Apollo、Autoware,PIX推出自动驾驶开发套件PIXKIT
    专为自动驾驶开发者打造的线控底盘——PIXLOOP
    甄别信息、病毒追踪、无人配送...这9个全球开源工具助力疫情抗击
    PIX无损线控改装——全系列车型及性能介绍
    PIX线控改装技术连载二 | 车辆组成模块之间的共同语言
    PIX入选Autodesk硅谷技术中心,以生成设计和金属增材制造落地L4自动驾驶通用底盘
    线控CRV,最高性价比的自动驾驶开发平台
    线控改装技术连载一之——线控开端和车辆组成
    CSS 创建
  • 原文地址:https://www.cnblogs.com/barney/p/1206508.html
Copyright © 2011-2022 走看看