jquery重叠加载栏div

前端之家收集整理的这篇文章主要介绍了jquery重叠加载栏div前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
所以我有一个数据表,我正在使用ajax获取数据。当检索数据时,表中的数据消失,出现一小点载入圈。我更喜欢数据留下(我知道如何做),并且加载圈在它的中心(不一定是垂直,至少水平)出现在桌子上,以及稍微透明的背景阻止把表的视图稍微(不是网页的其余部分)。如何让div出现在桌子上呢?

解决方法

只需使用jQuery的.html()方法将带有加载圆的新div注入到保存表格的div中。然后用css来设计它。也许给它一个不透明的背景图像。并且相对或绝对地定位加载圆。

说你有:

<div id="table_container>
    <table>
        <tr>
            <td>something</td>
            <td>something</td>
        </tr>
    </table>
</div>

加载新数据时使用:

$('div#table_container').html('<div id="overlay"><img src="path/to/loading/img.png" class="loading_circle" alt="loading" /></div>');

并将其风格设想为:

#overlay {
    width: 100%;
    background: url('path/to/opaque/img.png') repeat;
    position: relative;
}

#overlay img.loading_circle {
    position: absolute;
    top: 50%;  // edit these values to give you
    left: 50%; // the positioning you're looking for.
}
原文链接:https://www.f2er.com/jquery/182327.html

猜你在找的jQuery相关文章